通过 CSS 2.x 中 outline 属性说关键字和值的不同

Eric 的文章 《Reset Reloaded》 中 代码:
1:focus {
2    outline: 0;
3}
:focus 规则中 outline 为何要设置为0呢?
Blank 怿飞的文章 《text-indent 隐藏文字时出现的 outline 问题 中说了原由。
CSS 界权威 Eric meyer 大师说了:
为什么在:focus 规则中把轮廓的宽度压掉呢?是因为必须自己定义一个 outline 属性,对其可访问性有用。
本人把outline的属性值挖出来,看看相应的值对应的是什么属性:
outline: none;
none这是个关键字,是outline-style(轮廓样式)的属性值。none就是无轮廓样式。
outline: 0;
0 是 0px 的简写。通常在这种情况下 px 可省写。是outline-width(轮廓宽度)的属性值。0就是轮廓宽度为0像素。
轮廓(outline)与边框(border)类似,二者的区别有两点:
1.轮廓不能参与到文档流中,所以不会影响文档流。
2.轮廓可能不一定为矩形,但也不是说为圆形,可能是“合并”的形状。
好了,继续研究meyer大师的reset (重置)代码...
参见:CSS2.1规范 18.4 用户界面之outline属性
注:IE 7及以下版本不支持该属性,可以在脚本中用hideFocus = 'true'定义。
posted on 2008-01-04 17:07  豆豆の爸爸  阅读(706)  评论(2编辑  收藏  举报