给字体添加背景图 HTML+CSS

标题：给字体添加背景图 HTML+CSS

问题描述：

我们知道盒子或方形容器里面可以通过 background-image: url(…);设置背景图片，而文字的设置背景图却甚少，其实文字也可以像盒子里放背景图的。

解决方案：

1.写一个div标签，里面写文字。

<div class="ceshi">
     给字体添加背景图片。
</div>

2.写css

.ceshi{
       height: 100px;
       width: 710px;
      line-height: 100px;
      font-size: 40px;
      font-weight: 1000;
      color: rgba(78, 75, 75,.1);
      background-image: url(2.jpg);
      background-size: 28% 140%;
      -webkit-background-clip: text;
      text-transform:uppercase;        

}

*url里写入自己的图片地址

*最后两行
-webkit-background-clip: text;
text-transform:uppercase;
是实现效果重点，其它都是是背景图或字体的样式。

3.注意，如果没效果，是因为它在有些浏览器是不兼容的。

效果