CSS基础入门4

1、行高补充：

（1）行高是可以继承的。
（2）行高的单位：
取值：
A.具体的像素值。
B.使用em
em指的是当前标签设置的字体大小。
比如当前标签字体大小为16px，那么2em=32px，如果当前标签字体大小为20px，那么3em=60px;
C.使用%百分号：
与em一样，都是以当前标签的字体大小为基数，如果大小18px，那么 line-height:200%;line-height: 36px;
D.可以什么单位都不带：
与em一样，也是当前标签的字体大小为基数。

注意：
a.在设置行高的时候，如果单位是em或者%，那么将来行高会先计算出来结果以后再继承给子元素。
b.在设置行高的时候，如果单位是没有，那么将来行高这个数字会先继承给子元素，然后再根据子元素的字体大小计算出行高。
c.行高与font的关系
font: font-style font-weight font-size/line-height font-family.
也就是说，在连写font的时候它自带一个行高。

---

３、margin两种特殊的现象：

（1）外边距的合并现象：
如果两个div上下排序，给上面一个div设置margin-bottom，给下面一个div设置margin-top，那么两个margin会发生合并现象，合并以后的值较大的那个。
（2）margin塌陷现象：
如果一个大盒子中包含一个小盒子，大盒子没有设置边框，给小盒子设置margin-top大盒子会一起向下平移。
解决方案：
A.给大盒子加一个边框
B.给大盒子设置一个overflow属性，值为hidden。
C.设置浮动也可以

---

3、浮动

（1）浮动的代码：
float:left;
float:right;

（2）浮动的特点

A. 浮动的元素会脱离标准流：
标准流就是浏览默认摆放盒子的标准。如果一个元素按照正常的标准流来显示，会在html中所属的位置占位，后面的元素会紧跟着它。但是浮动脱了标准流，将来在看到浮动的元素之后，不能以正常的标准流来进行判断。（在标准流中不占位置了，它是在标准流之上）

B. 浮动以后的元素会覆盖在标准流的元素之上。

C.浮动规则：浮动找浮动，不浮动找不浮动
浮动找浮动：只有写在同一个结构下面的浮动才会浮动找浮动。

D. 浮动显示的位置与原本不浮动之前的位置是对应的

E. 浮动的元素只会影响下面的元素，不会影响上面的元素

F. 浮动的元素会改变显示方式
不管元素是行内元素还是块级元素将来在显示 的时候都会在同一行中显示。浮动以后的元素可以设置宽高。其实，浮动以后的元素的显示方式与行内块级元素一样。

（3）浮动最初是为了解决文字环绕图片这个问题的

---

4、导航不能用a标签来做

（1）导航与导航之间应该是列表的关系，所以如果想要将这个些关系通过html语义化表示出来必须要用到ul标签。
（2）如果这些a标签你不用其它的标签包裹起来，那么将来浏览器会将这些a标签中的文字当作全部一起显示。SEO在查看页面的时候会认为这个页面进行作弊，就是进行了关键字的堆砌。