本文详细介绍了HTML中的块级元素、行内元素和行内块元素的特性，包括它们在文档中的表现形式、尺寸设置以及相互转换方法。了解这些基础知识对于HTML布局和网页设计至关重要。常见块级元素如div、p、h1等，行内元素如a、span，行内块元素如input、img。通过调整display属性，可以实现元素类型的转换。
关键词：块级元素 行级元素 行内块元素
HTML(Hyper Text Markup Language )作为一种标记语言，网页所有的内容均书写在标签内部，标签是组成Html页面的基本元素，因此对标签特性的理解在HTML的学习过程中比较重要。
HTML中的标签从闭合的角度可以分为闭合标签和空标签。而HTML中大部分标签都是闭合标签，其他少数为空标签，常见的空标签有、 、 、 、 等。
HTML中对标签另一种分类方式，是根据标签在文档中的位置特性进行分类的，它将元素分为三类：块级元素，行内元素，行级块元素(也称块级行元素)。
1.块级元素(block)
特点：(1)可以设置宽高、内、外边距；
(2)独占一行(即前后均有换行)；
(3)块级元素如果不设置宽度和高度，则宽度默认为父级元素的宽度。高度则根据内容大小自动填充。
常见的块级元素： div、p、h1、h2......hn，ol、ul、dl、li、form、table
2.行级元素(inline)
特点：(1)不可设置宽高、上下内、外边距。(左右内、外边距设置有效)
(2)其宽度和高度由其内容自动填充。
(2)其他行级元素共处一行 ；
常见的行级元素：a、span、i、lable等
3.行内块元素(inline-block)
特点：(1)可以设置宽高、内外边距；
(2)可以与其他行内元素、内联元素共处一行；
常见的内联元素：input、img
4.元素之间的转化
可以在行内样式或css样式中改变元素的display将三种元素进行转换。
display:block；(将元素变为块级元素)
display:inline； (将元素变为行级元素)
display：inline-block；(将元素变为行级块元素)
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
