Html 实训5

技巧总结：

1. 对多个li标签使用标签选择器时，margin-bottom对第一个不影响，因为margin-bottom改变两个元素间底边距，而是相对于第一个块的，所以第一个不动，使用margin-top将改变第一个，因为第一个li的margin-top是相对于ul标签所以，margin-top改变他也改变。

2. 对网页布局先用float，float若不能达到要求再改用position

3. 对列表内的img标签可以使用指定标签选择器的方法，对width和height使用比例指，img会自适应父标签的大小

4. line-height可以设置span中字体的高度位置

5. 在写选择器的时候带上父class，则该层选择器的名字可以相同。下例：

    .class1 class2 news{}

    .class3 class4 news{}

在使用时，可以只写上news。

6. 在具体的一个div块内可以使用position属性调整元素位置，若使用absolute时，其父div需要时也是position属性才行，可以设置position为relative，relative与float属性变化不大。

7. 使用transform: scale();是可以放大缩小元素

8. 使用一个标签A嵌套标签B，标签A设置overflow:hidden，则标签B放大超过标签A的部分则不显示。

9. transition是一个元素变化的属性，可以设置变化的延迟时间，变化的快慢方式等。

10. 使用float进行布局可以消除div之间莫名的空隙

错误总结：

1. border：1px solid black，则在盒子模型中元素的border上下左右都会占1个px。

2. position: absolute和float属性不能一起使用

3. 对a标签使用width、height后设置background-color无法显示出一个矩形，因为a标签是inline元素，所以修改display才能显示

4. span、a等inline元素，需要修改display才能进行布局