新丰家园
标题:
网页中用CSS样式表隐藏文字的挺新颖方法
[打印本页]
作者:
worm
时间:
2007-8-30 18:18
标题:
网页中用CSS样式表隐藏文字的挺新颖方法
<font style='font-size:1px;color:white'>ttxhfree</font>
<P style="TEXT-INDENT: 2em">说明为什么现有的几种CSS隐藏文字的方法的缺陷和新的方法如何弥补。实用性一般，但是这个方法挺新颖的。</P>
<P style="TEXT-INDENT: 2em"><STRONG>1.display:none;的缺陷</STRONG></P>
<P style="TEXT-INDENT: 2em">搜索引擎可能认为被隐藏的文字属于垃圾信息而被忽略</P>
<P style="TEXT-INDENT: 2em">屏幕阅读器（是为视觉上有障碍的人设计的读取屏幕内容的程序）会忽略被隐藏的文字。</P>
<P style="TEXT-INDENT: 2em"><STRONG>2. visibility: hidden ;的缺陷</STRONG></P>
<P style="TEXT-INDENT: 2em">这个大家应该比较熟悉就是隐藏的内容会占据他所应该占据物理空间</P>
<P style="TEXT-INDENT: 2em"><STRONG>3.overflow:hidden;一个比较合理的方法</STRONG></P>
<P style="TEXT-INDENT: 2em">
<BLOCKQUOTE style="BORDER-RIGHT: #a0a0a0 1px dashed; PADDING-RIGHT: 6px; BORDER-TOP: #a0a0a0 1px dashed; PADDING-LEFT: 6px; BACKGROUND: #ffffff; PADDING-BOTTOM: 6px; MARGIN: 4px; BORDER-LEFT: #a0a0a0 1px dashed; PADDING-TOP: 6px; BORDER-BOTTOM: #a0a0a0 1px dashed">
<P></P>
<P style="TEXT-INDENT: 2em">.texthidden { display:block;/*统一转化为块级元素*/ overflow: hidden; width: 0; height: 0; }</P></BLOCKQUOTE>
<P>就像上面的一段CSS所展示的方法，将宽度和高度设定为0，然后超过部分隐藏，就会弥补上述一、二方法中的缺陷，也达到了隐藏内容的目的。</P>
\\
欢迎光临 新丰家园 (https://xinfengbbs.com/)
Powered by Discuz! X3.2