样式表中定义.content_head {border:1px solid #ccc;background:red;vertical-align:middle;line-height:20px;}

如果line-height改为height就不行

解释是：
1:http://www.w3.org/TR/CSS21/visudet.html#line-height其中有一句
The inline boxes are aligned vertically according to their ‘vertical-align’ property.
2:http://www.w3.org/TR/CSS21/visudet.html#propdef-vertical-align另外有一句
This property affects the vertical positioning inside a line box of the boxes generated by an inline-level element.

可见vertical-align和line-height两个属性是连在一块定义的。vertical-align属性影响的垂直定位，是局限在“行”这个渲染单位里面的。所以需要先设置line-height，设定line box的高度，才能使用vertical-align。而height影响的是div这个block的高度，而不是line box。

谢谢BSD同学的解答。