浅谈CSS学习中的瓶颈

都知道CSS入门容易，但当技术达到一定程度时，便会发觉技术停滞不前了。这时候，我们已经进入瓶颈期了。这时候就需要我们静下心来，深入学习。下面，看几个问题：

有时候，如果我们CSS的基础足够得扎实与强大，我们会自热而然进入到B阶段，但这种完全经验积累的进阶学习需要很长的时间周期。

如果没有一定的CSS基础以及经验做支撑，我们是无法进入B阶段的。

深度才是你的核心竞争力。深入的细节掌握，深入的机制理解等，这些都是要下苦功才能掌握的，这是你有别于其他千千万万自认为会写页面的CSSer们的地方！

它的增长曲线应是这样的

1. dl, dt, dd三个标签浏览器默认margin值多少？是否有标签默认文字粗体？
2. line-height:150%和line-height:1.5的区别是？
3. float为何会让外部容器高度塌陷？这是bug？
   一丝的文章

4. vertical-align的表现为何在IE7, IE8, IE9下表现不尽相同？其中的渲染机制是？

   张鑫旭

答案

第一题

dl有默认margin值，没有padding值。在Chrome,Firefox,Safari,Opera,Maxthon,IE8.0中：margin:12px 0px;在IE6.0,7.0中：margin:19px 0px;

dd标签有默认margin-left：40px；

需要注意的是ul、ol具有默认padding。ol,ul标签：有默认margin-（top,bottom且相同）值，有默认padding-left值
在Chrome,Firefox,Safari,Opera,Maxthon,IE8.0中：margin:12px 0px;在IE6.0,7.0中：margin:19px 0px;默认padding-left值：
在Chrome,Firefox,Safari,Opera,Maxthon,IE8.0中都是padding-left：40px;
在IE6.0,7.0中没有默认padding值，因为ol,ul标签的边框不包含序号。

第二题

有单位时，子元素继承了父元素计算得出的行距；无单位时继承了系数，子元素会分别计算各自行距。如：

//当line-height:xxx %时：
body{ font-size:14px; line-height:150%;  }
h1{ font-size:26px; }
//实际是：
body{ line-height:21px; /* 14px*150%=21px */ }  
h1{ line-height:21px; } /* 继承父元素计算出来的line-height ,21px */

//当line-height:x.x 时：
body{ font-size:14px; line-height:1.5;  }
h1{ font-size:26px; }
//实际是：
body{ line-height:21px; /* 14px*1.5=21px */ }   
h1{ line-height:39px; /* 26px*1.5=39px */ }

关于css.reset文章

关于HTML默认样式表

去除inline-block元素间距的办法