重看css权威指南 part6

  上一部分结束得有点突兀，没有给什么例子，因为关键的概念已经讲得很清楚了。

  由于该书的写作方式，没法每次把一个点的内容全讲完(渗透在每个章节中)，只先这样一部分一部分总结了。

  关于display的值，inline-block是混合了块元素的行内元素的一种特殊存在，这个大家都知道。但是有一点你可能不知道，当他像行内元素一样与文本排列在一行时，表现出的布局方式和替换元素一样。也就是说，margin，padding，border会影响它行内框的高度。

  还有一个混合了行内元素和块元素的属性。run-in，支持性貌似不太好。为一个块元素声明该属性之后，他会表现为紧跟它之后的块元素的第一个行内框。也就是说，这样写

<h1 style="display:run-in">sss</h1><div>eeeeeeeeee</div>

和这样写

<div><span>sss</span>eeeeeeeeee</div>

效果是差不多的。注意两点1.使用了run-in后只有它后面的第一个元素是块元素才有效。2.例子中的h1仍会继承父元素的样式，而不会继承它后面的div的样式。

内边距，边框和外边距

  内边距和外边距前面说过了，这里说下边框。边框的颜色默认为文本的颜色，若没有文本，则为父元素文本的颜色。

  边框的样式:border-style(单边样式：border-top-styoe | ...)

  值：none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | inherit

  继承性：无

  默认值：none(此时无论设置宽度为多少，都将变为0)

可以像margin一样，为各个边应用不同的样式时使用简便写法。对于边框的宽度，颜色也是同样。