对于处理边框和行内元素我们应该很熟悉了,因为其规则很大程度上与外边距和行内元素的相应规则相同,这在第7章做过介绍。不过,在此还是简要地介绍一下。
首先,不论网站建设人员为行内元素的边框指定怎样的宽度,元素的行高都不会改变。下面为粗体文本设置上下边框:
strong{border-top:10px solid gray;border-bottom:5px solid silver;}
重申一句,这个语法在规范中是允许的,不过它对行高绝对没有任何影响。但是,由于边框是可见的,所以将会绘制出来。
边框该放在哪里就会放在哪里。
同样地,所有这些只是对行内元素的上下边成立,左右边则是另一回事。如果应用一个左边框或右边框,不仅该边框可见,而且文本会在其旁边显示(即不会覆盖),如图8-37所示:
strong {border-left: 25px double gray; background: silver;}
就像外边距一样。如果网页设计人员设置了边框,浏览器计算换行时并不受行内元素所设置的任何框属性的直接影响。唯一的作用是边框所占空间可能把行中的某些部分向后移一点点,而这有可能改变位于行尾的词。
警告:网站建设CSS边框的兼容性问题很少。最麻烦的是,Navigator4.x不会在块级元素内边距区周围画边框,而会在内边距和边框之间插入一些空间。对于Navigator 4.x,在行内元素上设置边框(或任何其他框属性)都可能极其危险。边框如此,外边距也是如此,原因是一样的(这在本章前面讨论过)。