{ hide_text } CSS文字隐藏总结报告(4)
作者:tracy2 来源:蓝色理想 时间:2010-06-13 17:19:00
兼容性:
优点:
兼容性好
超链接和图片替代文本可用
缺点:
使用限制较大,需要定宽高
多一丁点:前置背景遮挡
代码片段:
(x)HTML
<!-- 在css无效和css有效图片无效都适用 -->
<a class="hide_bg" href="#"><span
class="front_bg"></span>我是可访问性的化身</a>
CSS
.hide_bg{
width:200px;
height:20px;
position:relative;
display:block;/* 行内元素需要 */
}
.hide_bg .front_bg{
background:url('bg_text.png') no-repeat; /* 背景内容等于或大于容器大小 */
position:absolute; /* 绝对定位,不影响文本 */
left:0px;
top:0px;
width:200px;/* 与父元素等宽高 */
height:20px;
display:block;
/* cursor:pointer; ie6和链接需要用 */
}
兼容性:
优点:
兼容性好
超链接和图片替代文本可用
可访问性强
缺点:
使用限制较大,需要定宽高
代码冗余,需要空标签
另辟蹊径:content:”"
代码片段:
(x)HTML
<!--只有opera支持,按定义只能用在:before 和:after-->
<a class="hide_ct" href="#">也许我才是最合适的,谁知道呢,内容表现分离。只有opera支持</a>
CSS
.hide_ct{ content:""; }
兼容性:
优点:
简单
缺点:
内容样式分离
不实用
标签:隐藏,CSS,文字
0
投稿
猜你喜欢
编辑BLOG文章的一些好习惯
2007-11-15 06:35:00
SQL Server 2005改进后的几个实用新特性
2008-05-07 19:16:00
谈谈网页设计中的字体应用 (2) serif 和 sans-serif
2009-11-24 13:04:00
妙用dw图层与表格进行网页布局
2009-07-14 21:57:00
如何编写CSS代码才能更有效率
2007-11-07 18:51:00
如何在社区建立一个寻呼台?
2009-11-08 18:59:00
oracle 日期函数
2010-07-23 13:32:00
CSS兼容性(IE和Firefox)技巧大全
2010-07-29 12:29:00
模拟下拉菜单[兼容IE系列以及火狐]
2009-12-13 10:23:00
W3C网页内容无障碍指南2.0(WCAG)
2008-11-20 13:40:00
怎么写好一份图形界面设计师简历
2009-04-16 13:10:00
Asp 日期格式化问题
2011-03-31 10:47:00
如何了解SQL的执行频率
2009-08-26 15:17:00
SQL Server 中死锁产生的原因及解决办法
2008-11-25 11:50:00
Oracle SQL性能优化系列学习三
2010-07-23 13:08:00
用ASP和SQL实现基于Web日历源码
2010-04-24 15:52:00
IE7兼容模式与兼容视图
2010-06-28 18:48:00
CSS样式和JavaScript脚本是否放置于外部文件的探讨
2008-08-08 12:39:00
oracle 在一个存储过程中调用另一个返回游标的存储过程
2009-09-26 18:54:00
asp生成一个不重复的随机数字
2007-09-12 19:12:00