CSS块级元素与行内元素

 

块级元素：block element，每个块级元素默认占一行高度，一行内添加一个块级元素后无法一般无法添加其他元素（float浮动后除外）。两个块级元素连续编辑时，会在页面自动换行显示。块级元素一般可嵌套块级元素或行内元素；

行内元素：inline element，也叫内联元素、内嵌元素等；行内元素一般都是基于语义级(semantic)的基本元素，只能容纳文本或其他内联元素，常见内联元素 “a”。

 

可变元素：根据上下文语境决定该元素为块元素或者行内元素。

CSS存在display:inline-block—行内块级元素属性，介于块级元素与行内元素之间。

 

若使用css控制，块元素和行内元素的属性差异会变小。例如：我们可以把行内元素span添加display:block属性,将该元素块级化。

XHTML中虽然大体上分为块级元素与行内元素，但各种元素之间还是有一定的嵌套关系，另外部分元素显示属性通过CSS转化后（例如将行内元素强制块级化后），仍然在元素嵌套中会出现一定的问题。所以，尽可能依照XHTML元素嵌套的具体规则处理才能避免错误。

 

块级元素(block element)

　　* div - 常用块级容易，也是css layout的主要标签   

　　* dl - 定义列表   

　　* h1 - 大标题   

　　* h2 - 副标题   

　　* h3 - 3级标题   

　　* h4 - 4级标题   

　　* h5 - 5级标题   

　　* h6 - 6级标题   

　　* hr - 水平分隔线   

　　* menu - 菜单列表   

　　* ol - 排序表单   

　　* p - 段落   

　　* table - 表格   

　　* ul - 非排序列表   

 

行内元素(inline element)

　　* a - 锚点

　　* b - 粗体(不推荐)   

　　* br - 换行   

　　* em - 强调   

　　* i - 斜体   

　　* img - 图片   

　　* input - 输入框   

　　* label - 表格标签   

　　* select - 项目选择   

　　* span - 常用内联容器，定义文本内区块   

　　* strong - 粗体强调   

　　* sub - 下标   

　　* sup - 上标   

　　* textarea - 多行文本输入框   

　　* u - 下划线   

 

可变元素

　　* button - 按钮   

　　* del - 删除文本   

　　* iframe - inline frame   

　　* ins - 插入的文本   

　　* map - 图片区块(map)   

　　* object - object对象   

 

以上信息仅供参考，请以各自浏览器中的实际表现为参照依据。

转载：http://wu110cheng.blog.163.com/blog/static/133349654201262293220816/