您好,欢迎来到骅坨科技网。
搜索
您的当前位置:首页css用背景图来替换文字来达到隐藏文字的目的

css用背景图来替换文字来达到隐藏文字的目的

来源:骅坨科技网


根据html代码的不同来分成两大类方法,如下

html代码:

hello see

第一种方法:text-indent

.replace-indent{

  height:200px;

  width:200px;

  background:url();

  text-indent:-9999px;

}

第二种方法:

.replace-indent{

  height:200px;

  width:200px;  

  background:url();

  text-indent:100%;

  white-space:nowrap;

  overflow:hidden;

}

第三种方法:

.replace-indent{

  height:0px;

  width:200px;

  background:url();

  padding:200px 0 0 0;

  overflow:hidden;

}

第四种方法:before

.replace-indent{

  width:image's width;

  height:image's height;

  overflow:hidden;

}

.replace-indent : before{

  content:url();

}

html代码:

hello see

第一种方法:

.replace-indent{

  height:200px;

  width:200px;

  background:url();

}


span{

  display:none;

}

第二种方法:

.replace-indent{

  height:200px;

  width:200px;

  background:url();

}

span{

  width:0;

  height:0;

  display:block;

  overflow:hidden;

}

第三种方法:

.replace-indent{

  height:200px;

  width:200px;

  background:url();

}

span{

  clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);

  -webkit-clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);

}

Copyright © 2019- huatuo5.cn 版权所有

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务