<span style="background:red; border:5px solid blue; padding:100px;">aaa</span>

1<br/>1<br/>1<br/>1<br/>1<br/>
<span style="background:red; border:5px solid blue; padding:50px;">aaa</span>
1<br/>1<br/>1<br/>1<br/>1<br/>

------解决方案--------------------

探讨

教材上写的是行内元素设置垂直padding和垂直border无效。
但是我试的时候是这些效果：
HTML code

<span style="background:red; border:5px solid blue; padding:100px;">aaa</span>



IE8、FF下：


IE6、IE7下：


IE8和FF应该更接w3c标准吧，但是IE6和IE……


------解决方案--------------------
行内元素：
  设置宽度无效；
  设置高度无效，只能通过line-height来设置；
  margin和padding 只有左右其效果，上下无效果；
如果想实现兼容性的效果：
  1）将行内元素转换成内联块，即：display:inline-block;然后设置内外间距；
  2）通过行高，至于文字的排版可以用text-align或者vertical-align属性来设置；