html中有亲和力的文字隐藏方法


1.display:none;的缺陷

  * 搜索引擎可能认为被隐藏的文字属于垃圾信息而被忽略,来自SEO Mistakes: Unwise comments

  * 屏幕阅读器(是为视觉上有障碍的人设计的读取屏幕内容的程序)会忽略被隐藏的文字。

  2. visibility: hidden ;的缺陷

  这个大家应该比较熟悉就是隐藏的内容会占据他所应该占据物理空间

  3.overflow:hidden;一个比较合理的方法

  程序代码

  .texthidden

{
display:block;/*统一转化为块级元素*/
overflow: hidden;
width: 0;
height: 0;
}

  就像上面的一段CSS所展示的方法,将宽度和高度设定为0,然后超过部分隐藏,就会弥补上述一、二方法中的缺陷,也达到了隐藏内容的目的

本文作者:
« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3