行内元素和块内元素分别有哪些?行内元素和块内元素的特点介绍

lxf2023-05-30 10:20:02

html行中的元素是什么?html块中的元素是什么?本文介绍了哪些是行内元素,哪些是块级元素,它们的特点和区别。

HTML中内联元素的特性:

行内元素也称为行内元素或嵌入元素。行中的元素和其他元素在同一行,高度、行高、内边距、外边距不能改变。宽度就是它的文字或者图片的宽度,不能改变。内联元素只能保存文本或其他内联元素。

之前文章中讲到的 a,img,br是行内元素。上一篇文章提到的a、img、br都是内嵌元素。

块元素的特征:

(1)总是从新的一行开始;

②高度、行高、外边距、内边距可以控制;

(3)默认宽度是其容器的100%,除非设置了宽度;

④可以容纳行内元素和其他块元素。

内联元素的功能:

(1)和其他元素在一条线上;

②高度、行高、外边距、内边距不能改变;

(3)宽度是其文字或图片的宽度,不可更改;

④行内元素只能保存文本或其他行内元素。

内联元素和块元素的描述:

根据CSS规范,每个网页元素都有一个显示属性,用于确定元素的类型。每个元素都有一个默认的显示属性值,比如div元素,它的默认显示属性值是“block”,这就变成了“块级”元素。span元素的默认显示属性值为“inline”,称为“inline”元素。div等块级元素会自动占据某个矩形空,这个矩形的外观可以通过设置高度、宽度、内外边距等属性来调整。相反,像“span”和“a”这样的内嵌元素没有独立的空空格,它附加在其他块级元素上。因此,为行内元素设置高度、宽度、内外边距等属性是无效的。

内嵌元素和块元素之间的差异:

(1).块级元素会独占一行,其宽度会自动填充其父元素的宽度。

内嵌元素不会独占一行,相邻的内嵌元素会排列在同一行。只有当一行放不下时,才会断行,其宽度会随着元素的内容而变化。

(2).通常,可以为块级元素设置宽度和高度属性,而行内元素的宽度和高度设置无效。

(注意:即使设置了宽度,块级元素仍然独占一行。)

(3)块级元素可以设置边距和填充。行中元素水平方向的左填充、右填充、左边距、右边距都产生边距效果,垂直方向的上填充、下填充、上边距、下边距不会产生边距效果。(水平方向有效,垂直方向无效)

什么是行元素和块元素?

块元素

地址-地址

块引用-块引用

中心-中心对准块

目录-目录列表

Div-common块级很容易,也是css布局的主要标签。

dl-定义列表

字段集-表单控件组

表单-交互表单

H1-标题

H2-字幕

H3-3标题

H4-4标题

H5-5标题

H6-6标题

HR-水平分割线

菜单-菜单列表

no frames-框架可选内容,(此块内容为不支持框架的浏览器显示。

no script-可选脚本内容(为不支持脚本的浏览器显示)

ol-排序表单

p段

格式化文本

桌子

ul-无序列表

内联元素(内联元素)

锚定点

缩写-缩写

缩写-首字母

b粗体(不推荐)

大号字体

br-换行符

引用文献

代码-计算机代码(引用源代码时需要)

dfn-定义字段

em-强调

字体-字体设置(不推荐)

I-斜体

图像-图片

输入输入框

kbd-定义键盘文本

标签-表格标签

q-短参考

s形破折号(不推荐)

samp-定义示例计算机代码

选择-项目选择

小-小字体文本

span——常用的内联容器,它在文本中定义块。

走向中线

强烈-粗体强调

子下标

超级上标

textarea-多行文本输入框

TT-电传文本

u形下划线

var-定义变量

[相关建议]

HTML5是什么?它的特点和优缺点是什么?

html的基本元素让你从头开始学习HTML

仅此而已。html的行内元素和块内元素是什么?关于html内联元素和块元素特征的更多细节,请关注AdminJS.cn其他相关文章!

adminjs.cn是一个以CSS、JavaScript、Vue、HTML为核心的前端开发技术网站。我们致力于为广大前端开发者提供专业、全面、实用的前端开发知识和技术支持。 在本网站中,您可以学习到最新的前端开发技术,了解前端开发的最新趋势和最佳实践。我们提供丰富的教程和案例,让您可以快速掌握前端开发的核心技术和流程。 Adminjs.cn还提供一系列实用的工具和插件,帮助您更加高效地进行前端开发工作。我们提供的工具和插件都经过精心设计和优化,可以帮助您节省时间和精力,提升开发效率。 在Adminjs.cn中,您可以找到您需要的一切前端开发资源,让您成为一名更加优秀的前端开发者。欢迎您加入我们的大家庭,一起探索前端开发的无限可能!