css 去掉字用图片背景

在网页设计中，有时我们需要用图片作为文本的背景，比如在标题上使用特定的字体，但是该字体不被支持，就可以将该字体做成图片，然后用CSS去掉字，再用图片作为背景。

实现该效果，可以使用CSS中的text-indent属性和background属性。text-indent属性可以设置文本缩进的值，将文本隐藏在屏幕视野外。而background属性可以设置元素的背景，包括背景色、背景图和背景位置等。结合两个属性，就可以实现将文字用图片背景代替的效果。

具体实现代码如下：

  .text {
        text-indent: -9999px;
     /* 将文本缩进屏幕外 */    background: url(路径/图片地址) no-repeat;
     /* 设置背景图 */    width: 图片宽度;
        height: 图片高度;
        display: block;
 /* 将元素设置为块级元素 */  }
    
在HTML中添加需要做成图片的文本：
h1 class="text">
    这是需要做成图片的文本/h1>
    

上述代码中，使用了h1元素作为例子，可以根据需要使用其他元素。同时，需要注意的是，将该元素设置为块级元素，保证图片作为块级元素展现，不会影响文档布局。

总的来说，通过CSS让字不显示，使用图片背景代替文字，可以达到更多的设计效果，丰富网页的视觉效果。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！