html元素类型详细介绍 包含 块元素、内联元素、可变元素

2024年04月09日 懒猪 前端开发 前端博客 个人博客 网站制作 鹏仔先生 百变鹏仔 HTML CSS javascript JS 共享博客

HTML元素分为三大类:块元素、内联元素、可变元素


1.块元素

常见块元素:div、p、ul、ol、li、dt、dl、dd、form、table、tr、td、h1、h2、h3、h4、h5、h6、hr、fieldset

注:默认状态有 margin、padding 的html元素有 body、ul、ol、dl、dd、li、p、h1-h6、td、input

块状元素的特点:

① 块状元素以块的形式显示为矩形区域

② 块状元素不会并排显示、自上而下排列

③ 块元素可以定义自己的宽度和高度以及盒模型中任意的padding、margin、border

④ 块元素可以作为一个容器容纳其他的块元素和内联元素


2.内联元素

常见内联元素:a、span、b、strong、em、i、label、img、input、textarea、select

内联元素的特点:

① 内联元素在一行逐个显示

② 内联元素没有自己的形状,不能定义宽度和高度,他的宽高由内容来决定

③ 内联元素设置与高度相关的一些属性时,会显示错误或不生效(如 margin-top、 margin-bottom、 padding-top、 padding-bottom、 line-height )

④ 内联元素嵌套块元素是不合理的


常见的内联块状元素:img、input、textarea、select

内联块状元素的特点:

① 既具有内联元素的特点,在一行逐个进行显示

② 又具有块状元素的特点,可以定义宽高以及 margin、padding、border

③ 只有内联块状元素设置 vertical-align 属性有效


3.可变元素

根据上下文关系决定元素类型(块元素或内联元素)


本文链接:http://so.lmcjl.com/news/1605/

展开阅读全文
相关内容