浮动
1、定位:定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素设置浏览器窗口本身的位置;定位分为普通流定位、浮动定位、相对定位、绝对定位;
2、普通流定位:页面中的块级元素,从上到下顺序排列,每一个新的块级元素都会出现在一个新行中,这就叫普通流定位,元素框之间的垂直距离是由框的垂直外边距决定;内联元素将在一行从左到右排列水平位置,不需要从新行开始,可以使用水平内外边距调整其间距。
3、浮动定位:浮动定位是指将元素排除在普通流之外,元素将不在页面占用空间,将浮动的元素放到包含框的左侧或右侧,浮动框依旧位于包含框内,浮动框可以想做或向右移动,知道他的边缘碰到包含框或者另一个浮动框的边框位置。其语法为:float:none/left/right;
1)float设置在需要浮动的元素中
2)如果包含框的宽度小于所有浮动框的宽度(本身宽度+边框+外边距)和,则浮动框会自动换行;
3)假设包含框中有a、b、c、d四个浮动框,当包含框的宽不能容下另一个浮动框时,同时换行又被别的浮动框阻挡,则该浮动框会在其左侧或右侧显示;
4)clear属性:清除浮动框所带来的影响,主要是规定元素哪边不允许出现浮动元素,其语法为:clear:none/left/right/both;(想让谁不出现浮动框,谁就往下移动)
1、定位:定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素设置浏览器窗口本身的位置;定位分为普通流定位、浮动定位、相对定位、绝对定位;
2、普通流定位:页面中的块级元素,从上到下顺序排列,每一个新的块级元素都会出现在一个新行中,这就叫普通流定位,元素框之间的垂直距离是由框的垂直外边距决定;内联元素将在一行从左到右排列水平位置,不需要从新行开始,可以使用水平内外边距调整其间距。
3、浮动定位:浮动定位是指将元素排除在普通流之外,元素将不在页面占用空间,将浮动的元素放到包含框的左侧或右侧,浮动框依旧位于包含框内,浮动框可以想做或向右移动,知道他的边缘碰到包含框或者另一个浮动框的边框位置。其语法为:float:none/left/right;
1)float设置在需要浮动的元素中
2)如果包含框的宽度小于所有浮动框的宽度(本身宽度+边框+外边距)和,则浮动框会自动换行;
3)假设包含框中有a、b、c、d四个浮动框,当包含框的宽不能容下另一个浮动框时,同时换行又被别的浮动框阻挡,则该浮动框会在其左侧或右侧显示;
4)clear属性:清除浮动框所带来的影响,主要是规定元素哪边不允许出现浮动元素,其语法为:clear:none/left/right/both;(想让谁不出现浮动框,谁就往下移动)