元素类型

标签：div   foo   这一   span   区域   盒模型   block   inpu   one   

内联元素
1.常见的内联元素如：a,span,i,em,strong,b等
2.内联元素的特点：
①内联元素其后如果是内联元素则会在一行内逐个进行显示；
②内联元素显示的宽度、高度只能根据所包含内容的高度和宽度来确定，不能直接定义它的宽和高，它的最小内容单元也会呈现矩形形状；
③内联元素也会遵循盒模型基本规则，但个别属性不能正确显示;

元素类型的转换
1.display的作用：设置或检索元素的类型。
属性值19个：block/inline/inline-block/nlone/list-item/table-header-group/table-footer-group....
2.属性值中有5个最常用的属性值
①Block 块元素的display默认属性值，当给元素加display：block后元素变为块元素。
（注：当元素设置了float属性后，就相当于给该元素加了display:block;属性；）
②inline 内联元素的display默认属性值，当给元素加display：inline元素变为内联元素
③inline-block 内联块元素默认属性值：行内的其他元素显示在同一行，但可以直接设置宽高，
如：img,input（注：只有这一个元素类型支持vertical-align属性）
4.none 元素被隐藏不显示
5.list-item 将元素转换成列表。li的display默认属性值；

总结
1、大部分块元素display属性值默认为block，其中li默认值为list-item。
2、大部分内联元素(行内元素、行间元素)的display属性值默认为inline,其中img,input，默认为inline-block。

元素类型

标签：div   foo   这一   span   区域   盒模型   block   inpu   one   

原文地址：http://blog.51cto.com/13570197/2317050