使用background-clip：text;您可以为文本使用背景，但您必须将其与页面的背景对齐

样式：

body {
  background: url(http://www.crystalxp.net/galerie/img/img-wallpapers-colors-krystof-----15400.jpg) repeat;
  margin:10px;
}
h1 { 
  background-color:#fff; overflow:hidden;
  display:inline-block; 
  padding:10px; 
  font-weight:bold;
  font-family:arial;
  font-size:200px;
}
span { 
  background: url(http://www.crystalxp.net/galerie/img/img-wallpapers-colors-krystof-----15400.jpg) -20px -20px repeat;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  display:block;
}

html

<h1><span>ABCDEFGHIKJ</span></h1>​

http://jsfiddle.net/JGPuZ/1/

自动对齐

与一个小的javascript，你可以对齐背景自动：

$(document).ready(function(){
  var position = $("h1").position(); //Position of the header in the webpage
  var padding = 10; //Padding set to the header
  var left = position.left + padding;
  var top = position.top + padding;
  $("h1").find("span").css("background-position","-"+left+"px -"+top+"px"); 
});

http://jsfiddle.net/JGPuZ/2/