17.7.11（关于css的总汇 div + css）

今天第一天写博客，有点小兴奋。

总结下我所认识的 div+css的布局:

1.行内元素和块级元素：1.1行内元素的宽和高是不能设置的，不带表就没有宽和高，他的宽和高是通过里面的内容来决定的。块级元素的宽和高是可以设置的，如果没有设置宽，它的宽就是100%，如果是子元素，那么，因为继承性，它的宽会和父元素的一样。1.2常用的行内元素有5个： span a  i input  img  。注意:行内元素的 水平方向上的padding 和margin是有用的。竖直方向上的没有用。

2,positon: 2.1positon的三种用法：relative absolute fixed  。relative是相对定位，之前误认为，relative就是用来给 absolute作参考的，其实不是的，relative 也可以用 top bottom left right属性的。 是相对之前的位置的移动，没有脱离文本流。absolute是绝对定位，fixed是固定定位；这两个都是脱离文本流的。注意：1.设置了position属性的（除relative之外），就不能设置float属性了。2.absolute 和fixed 有这两个的属性，就会变成块级元素，relative不会。总结下，就是relative是特例

3.float:浮动属性。3.1所有的元素经过浮动，都会变成块级元素。3.2浮动元素会脱离文档流，就相当于第二层文档流，但是他们会自动拥有display:inline-block属性（不知道是不是）。如果想让三个div 成三块横排，三个div都设置float属性。3.3 float的缺点：3.3.1在同级别元素中，没设置float的元素会被设置了这个属性的覆盖掉，3.3.2行内元素的会环绕在float周围，比如文本。3.3.3如果父元素没有设置高度，会导致父元素的宽度凹陷。解决办法：1.设置父元素的高   或者设置父元素的 overflow:outo ||  hidden  2 在浮动元素同级末尾加<div style="clear:both"> <div>

注意：设置了float的值，它的水平margin无效（不包含padding）这个是假的

4.z-index 只能在position属性时才能用？