伴随着牛腩油腻的嗓音，我开始了css之旅。
1什么是css
css:cascading style sheet.级联样式表，主要用来网页设计。如果把它与我之前做过的系统作比较，它就是用于设计界面的。它最大的优点在于能够使网页表现与内容分离，使界面和软件内容解耦，可以理解为设计模式在页面设计的体现。
2什么是css盒子
上图就是一个标准的模型。一个盒子基本包含这样几个元素
内容(content)、边框距(padding)、边界(border)和边距(margin)
由图所知，padding由padding-bottom,left,top,right四部分构成。margin由bottom,right,top,left四部分构成。padding是内容和边框之间的距离。margin是块状元素之间的距离。值得注意的是，margin是透明的。
3一个诡异的现象
<div id=”a”>
块状元素a
</div>
<div id=”b”>
块状元素b
</div>
它们的样式是
#a
{
background-color:#333;
margin-bottom:10px;
}
#b
{
background-color:#666;
margin-top:20px;
}
也就是说块状元素a与块状元素b应该相隔30个元素,结果却如下
经测量，a,与b相隔20个元素，有10个元素的距离被吞掉了。这是为什么呢
上网查过资料，这种现象叫做Collapsing margins.中文名称为margin的折叠.造成以上现象的原因是, 我们在css中并没有声明块状元素的高, 因此它的高便被设为auto(自动)了. 一旦其值被设为auto, 那么浏览器就会认为它的高为border-top到border-bottom之间的距离, 也就造成了元素被吞掉的情况。下面的图对于这个问题解释的更加详细（此图来自css吧）
解决问题的方法是：用padding代替margin.
4令人眼花的选择器
就先写这么多吧，随着学习的继续，我应该会有更多的收获。
