第三天下午 8.19

css属性里面的浮动属性:

浮动属性是区别于普通文档流的浮动流 浮动属性能让被修饰的元素在水平方向上进行移动,(向左,向右)当属性被浮动给修饰之后,会区别于普通的文档流动.当碰到当前的包含框(也就是父级边框属性就会停止浮动).当碰到另外的一个浮动框的时候也会停止浮动.

如果当某一个浮动元素无法被父级边框与同级浮动框同时给包裹住的时候就会"往下挤"间接的改变了该元素的垂直上下方向.

当被浮动的元素脱离了当前文本流的时候,该元素的初始位置还在,会有下一个没有浮动的元素进行填充.(特殊情况:文本文字,文本文字是真实的结构 不会被浮动元素给覆盖)

css属性里面的盒模型概念:

 

一个标准的盒子会有:

content:

(盒子内容:高和宽 处于盒子模型的最内部),如果没有padding,marriage,border等元素的话就是,该盒子的高和宽.

padding(内边距):

"padding通常是给父级元素添加的",用来调整父级与子级之间的位置

padding会撑大使用该元素的盒子,会破坏写好的布局,所以使用的时候需要进行计算,把高度与宽度进行减少--注意padding有4个值,当想要减少高或者宽的时候数值需要*2.

子集添加padding也会撑大容器的大小要注意相对于谁来说才是当前要调整的盒子.

margin:外边距,不会修改盒子的大小,margin是用来修改同一级元素之间的距离的,需要移动哪一个就给哪一个元素添加margin属性 margin属性不会撑大盒子.但是在进行计算的时候也要注意也是会占用数值的.

内外边距的用法:

*{

margin:0;

padding:0

}(清除所有的内外边距,进行格式化)

版心居中{

margin: 0 auto;(上下外边距为0,左右外边距自动适应)

}