1、Css display值与解释-（详细可见的）参数：
block :块对象的默认值。用该值为对象之后添加新行none :隐藏对象。与visibility属性的hidden值不同，其不为被隐藏的对象保留其物理空间inline :内联对象的默认值。用该值将从对象中删除行compact :分配对象为块对象或基于内容之上的内联对象marker :指定内容在容器对象之前或之后。要使用此参数，对象必须和:after及:before 伪元素一起使用inline-table :将表格显示为无前后换行的内联对象或内联容器list-item :将块对象指定为列表项目。并可以添加可选项目标志run-in :分配对象为块对象或基于内容之上的内联对象table :将对象作为块元素级的表格显示table-caption :将对象作为表格标题显示table-cell :将对象作为表格单元格显示table-column :将对象作为表格列显示table-column-group :将对象作为表格列组显示table-header-group :将对象作为表格标题组显示table-footer-group :将对象作为表格脚注组显示table-row :将对象作为表格行显示table-row-group :将对象作为表格行组显示
2、代码段如下
#main { display : table ; border-collapse : collapse ; } #nav { display : table-cell ; width : 180px ; background-color : #e7dbcd ; } #extras { display : table-cell ; width : 180px ; padding-left : 10px ; border-right : 1px dotted #d7ad7b ; } #content { display : table-cell ; width : 380px ; padding-left : 10px ; }
< id="wrapper"> < id="main"> < id="nav"> navigation column content… </> < id="extras"> news headlines column content… </> < id="content">main article content… </> </> </>