经典:CSS使用高级技巧20则之六

ZDNet软件频道 时间:2008-09-21 作者: | 互联网实验室 我要评论()
本文关键词:CSS 20则 技巧 软件
经典:CSS使用高级技巧20则之六

15. 字体变形命令

text-transform 命令很有用,它有3个值:text-transform: uppercase, text-transform: lowercase 
和 text-transform: capitalize。第1个会把文字变成全大写,第2个变成全小写,第3个变成首字母大写。这对拼音文字非常有用,即使输入时有大小写错误,在网页上也 看不到。

16. IE中图片文字消失的问题

有时会遇到文字或背景图突然消失的问题,刷新一下又出现了,这在靠近漂浮元素时更容易发生(注:没见过)。此时,可以为消失的元素设定: position: relative ,如果不行,再考虑为这些元素指定一个宽度试试。

17. 不可见文字

不 论因为何种原因希望某些网页文字不在浏览器中显示,比如为了打印或为了小屏幕而让某些文字不显示,都可以用 display: none 。这非常简单,但有时对  某些人这有点没用,他们能去掉这个控制,这时就要用到: position: absolute; left: -9000px 。

这实际上是把文字指定在页面以外显示。


18. 为手持设备设计专门的CSS

也就是手机/PDA等小屏幕用户,可以专门设计一个CSS来让网页显示更舒服些。为此,可以把浏览器窗口调整到150点宽来看效果。指定专门的手持设备的CSS的语法是:


也可以阅读专门的手持设备可用性。

19. 3D效果的按钮

以前要想制作带有3D效果,并且点击下去还会变化的按钮,就得用图片替换的方法,现在CSS就可以了:

a

{

display: block;

border: 1px solid;

border-color: #aaa #000 #000 #aaa;

width: 8em;

background: #fc0;

}

a:hover

{

position: relative;

top: 1px;

left: 1px;

border-color: #000 #aaa #aaa #000;

}

至于效果,还可以自己调整了。


 

CSS

20则

技巧

软件


百度大联盟认证黄金会员Copyright© 1997- CNET Networks 版权所有。 ZDNet 是CNET Networks公司注册服务商标。
中华人民共和国电信与信息服务业务经营许可证编号:京ICP证010391号 京ICP备09041801号-159
京公网安备:1101082134