CSS布局

1.流布局

默认的布局方式。

属性:display,position,float

1.display属性

规定元素生成的框的类型。

默认值为:inline

继承方式:no

可能的属性值
none 此元素不被显示
block 作为块元素显示,前后带有换行符
inline 作为内联元素显示,前后不带换行符
inline-block 行内块元素
list-item 作为列表显示
run-in 根据上下文决定显示类型
table 作为块级表格显示,前后带有换行符(类似于<table>)
inline-table 作为内联表格显示,前后不带换行符
table-row-groud 作为一个或多个行的分组显示(类似于<tbody>)
table-header-groud 作为一个或多个行的分组显示(类似于<thead>)
table-footer-groud 作为一个或多个行的分组显示(类似于<tfoot>)
table-row 作为表格行显示(类似于<tr>)
table-column-group 作为一个或多个列的分组显示
table-column 作为一个表格单元格列显示
table-cell 作为表格单元格显示
table-caption 作为表格标题显示
inherit 规定从父系继承该属性

2.position属性

规定元素的定位

默认属性:static

继承方式:no

可能的值
absolute 绝对定位,是相对于离他最近的父元素指定的
fixed 绝对定位,相对于浏览器窗口进行定位
relative 相对定位,相对于正常位置进行定位(元素仍在正常流中)
static 没有定位,元素正常的出现在流中
inherit 规定从父系继承该属性

3.float属性

定义元素的浮动方向。

浮动元素会生成块级框。

默认值:none

继承性:no

可能的值
left 元素向左浮动
right 元素向右浮动
none 元素不浮动,显示在其文本出现的位置
inherit 规定从父系继承该属性
原文地址:https://www.cnblogs.com/cff2121/p/9670551.html