常见行内元素、块级元素、行内块元素

最新推荐文章于 2025-03-16 10:33:14 发布
最新推荐文章于 2025-03-16 10:33:14 发布
阅读量1.5w 收藏 23
点赞数 7
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011523953/article/details/105461641
版权
本文详细介绍了HTML中的块元素和行内元素，包括<div>、<p>、<a>、<span>等常见标签的使用场景，并解释了特殊行内块元素的概念。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1、常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中<div>标签是最典型的块元素。
2、常见的行内元素有<a>、<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<span>等，其中<span>标签最典型的行内元素。有的地方也成内联元素
3、在行内元素中有几个特殊的标签——<img />、<input />、<td>，可以对它们设置宽高和对齐属性，有些资料可能会称它们为行内块元素。

行内元素、块元素都有哪些
09-22
行内元素只占内容的宽度，块元素不管内容多少都要占全行，下面为大家介绍下常见的行内元素及块元素有哪些，感兴趣的朋友可以参考下，希望对大家有所帮助
全面了解行内元素与块级元素的区别
09-24
块级元素是一类元素，它的特点是在页面上以块的形式展现，独占一行，即使没有设置宽度，也会延伸至其容器的边界。常见的块级元素包括, 至, , , , , , , , , , , , , 等。块级元素可以设置宽度和高度，它们的排列方式...
CSS块级元素与内联元素
yym154的专栏
02-11 647
<br />2009-12-01<br />CSS文档流与块级元素（block）、内联元素（inline），之前翻阅不少书籍，看过不少文章， 看到所多的是零碎的CSS布局基本知识，比较表面。看过O'Reilly的《CSS权威指南》，发现里面提到的文档流概念让我很敏感。 可恶的是书中并没有解释文档流是什么东西，或许作者觉得这个太简单了以至于不值一提。但我觉得，这个概念实在太重要了。理解了它，一堆CSS布局的理论都变得易于理解，并且体会到CSS这套设计的合理性所在。 文档流<br />将窗体自上而下分成一行行，
CSS块元素、行内元素、行内块元素详解
最新发布
m0_73941339的博客
03-16 1225
效果：两个元素分别独占一行，且的宽度为200px，默认宽度为父容器100%。宽度：默认占父容器的 100%（即父容器的宽度）。高度：默认由内容撑开（即内容的高度决定，不会自动占满父容器的高度）。HTML 结构 CSS 样式 运行结果：效果说明HTML 结构 CSS 样式 效果说明 效果：span和a在同一行显示，且无法设置宽高。行内块元素兼具块元素和行内元素的特点： 效果：图片和按钮水平排列，且可以设置宽高。元素嵌套规则：行内元素的空白间隙：display属性转换：为什么行内元
CSS里常见的块级元素和行内元素
weixin_30399821的博客
10-04 287
根据CSS规范的规定，每一个网页元素都有一个display属性，用于确定该元素的类型，每一个元素都有默认的display属性值，比如div元素，它的默认display属性值为“block”，成为“块级”元素(block-level)；而span元素的默认display属性值为“inline”，称为“行内”元素。div这样的块级元素，就会自动占据一定矩形空间，可以通过设置高度、宽度、内外边距等属性，...
行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
weixin_34413802的博客
02-12 255
首先：CSS规范规定，每个元素都有display属性，确定该元素的类型，每个元素都有默认的display值，如div的display默认值为“block”，则为“块级”元素；span默认display属性值为“inline”，是“行内”元素。 （1）行内元素有：a b span img input select strong（强调的语...
行内块元素有哪些？
zybijiso666的博客
03-14 460
1：行内元素有： a( 锚点) b(粗体) span(常用内联容器，定义文本内区块) select(项目选择) strong(粗体强调) label(表格标签) cite (引用) code(计算机代码) 2：块级元素有： div ul(无序列表) ol(有序列表) dl(定义列表) table(表格) form(表单) h1 (一级标题) p(段落) hr pre(预格式) 3：行内块元素常见的有： img input textarea
微信小程序布局之行内元素和块级元素
03-29
元素按照显示方式主要可以分为块级元素和行内元素，元素的显示方式由display属性控制。 块级元素特点总结： 1、总是在新行上开始 2、宽度的默认为width+margin-left+margin-right+padding-left+padding-right刚好...
html中的行内元素和块级元素有哪些.pdf
05-08
可以将行内元素转换为行内块元素。 此外，设置 float 属性也可以使行内元素转换为块级元素，并拥有浮动特性。设置 position 属性也可以使行内元素转换为块级元素，但这只是副作用，它们的主要作用是干扰布局效果。...
行内块级元素.txt
02-06
### 行内与块级元素概述 在HTML中，元素主要分为两大类：块级元素和行内元素。这两种类型的元素具有不同的显示特性和布局方式，掌握它们的区别对于编写高效且美观的网页至关重要。 #### 块级元素 块级元素（Block...
前端日记01_行内元素和块级元素
01-20
从html的角度看标签分为行级元素/内联元素(inline)、块级元素(block)、行级块元素(inline-block)、其他元素。 行级元素： 设置宽高属性无效 与其他行级元素在一行，不设置高度时，默认高度为文字高度 设置margin:...
常见的块元素与行内元素
clearclearing的博客
11-30 952
块级元素：div、dl、dt、ul、ol、li、h1--h6、p、table、th、tr、hr 行内元素：img、span、input、strong、i、em、br、lable、tt 注意：行内元素不能设置width、height、margin、padding；只能通过line-hight来设置
常见的块元素 行内元素 行内块元素
Ajax_A的博客
08-27 664
常见的块元素也是在平常中经常用到的标签元素 *新增标签 <header></header>* <main></main>* <footer></footer>* <nav></nav>* <article></article>* <aside></aside&g...
记录常见的行内元素
ljyahaha的博客
10-23 897
常见的行内元素 行内元素：行内大多为描述性标记 <span></span> <a>...</a> 链接 <br> 换行 <b>...</b> 加粗 <strong>...</strong> 加粗 <img > <sup>...</sup> 上标 <sub>...</sub> 下标
行内元素有哪些？块级元素有哪些？ 行内块元素有那些？他们有什么区别？
qingdouxiaohua的博客
09-10 1045
独占一行，不能与其他任何元素并列。能接受宽高，如果不设置宽度，那么宽度将默认变为父级的100%。块级元素有：div、 ul、ol、li、h1...h6、p、td、th、form。默认宽度就是内容的宽度；高度、宽度、内外边距都可以自定义；和相邻的行内元素（包含行内块）在一行上，它们直接会有空白缝隙；与其他行内元素并排，不能设置宽高，默认的宽度就是文字的宽度。行内元素有： a、 b、span、br、 i、 s。行内块元素有：img、input、textarea。
行内元素有哪些？块级元素有哪些？空（void）元素有哪些？
dizhansu5285的博客
09-11 1153
CSS规范规定，每个元素都有display属性，确定该元素的类型。每个元素都有默认的display值，如div的display默认值为“block”，则为“块级”元素；span默认display属性值为“inline”，是“行内”元素。 1.行内元素有：a（锚点），b（粗体（不强调使用）），span（常用内联容器，定义文本内区块），img（图片），input（输入框），select（项...
行内块元素有哪些标签_html常见的块元素与内联（行内）元素用法说明
weixin_39636608的博客
11-28 1157
html平时常见的块元素有：div, p, h1, h2, h3等，内联元素有：span, a, img等。块元素的属性：无论内容是什么，都会独占一整行。主要用于页面布局。内联元素的属性：只占自身大小的元素，不会占用一行。主要用于选中文本设置样式。div块元素仅仅只用于进行页面布局，它自身不带任何默认样式。span内联元素可以用来选中文本设置文本的样式，其自身不会带默认样式。一般情况下，只使用块元...
常用的块级元素（block）、行内元素（inline）以及行内块元素（inline-block）的解析
热门推荐
码飞_CC的博客
09-22 3万+
一.块级元素： 不废话，直接上图（div、p、h1~h6、ul、ol、dl、li、dd、table、hr、blockquote、address、table、menu、pre，HTML5新增的header、section、aside、footer等） 从浏览器的显示结果可以看出，块级元素新开启一行（即使是设置了width属性也是独占一行）、尽可能撑满父级元素的宽度，可以设置width和hei...
行内元素 行内块元素 块级元素 英文
01-03
### 行内元素、行内块元素和块级元素的区别 #### 定义与特性 在HTML中，元素可以被分类为三种主要的显示模式：行内元素（inline elements）、行内块元素（inline-block elements）以及块级元素（block-level elements）。每种类型的元素具有不同的布局行为。 - **行内元素**通常只占据其内容所需的空间宽度，并且不会强制在其前后创建新的行。这类元素适合用于文本中的标记，比如`<a>`超链接标签或`<strong>`强调文字标签[^2]。 - **行内块元素**则结合了行内元素不独占一行的特点与能够设置宽高属性的能力。这意味着虽然它们像行内元素一样在同一行内排列，但是可以通过CSS来指定具体的尺寸大小，如通过`display:inline-block`样式实现的效果所示[^1]。 - **块级元素**默认情况下会在页面上以新的一行开始并结束，在水平方向上尽可能多地占用空间直到遇到父容器边界为止；常见的例子有`<div>`, `<p>`, `<article>`等结构化标签。 #### CSS控制展示方式 利用CSS `display` 属性可改变这些元素的行为： 对于希望某个原本是行内的元素表现得更像一个独立区块时，可以将其`display`设为`block`; 而如果想要保持它与其他兄弟节点同行的同时又能自定义高度宽度，则应该采用`inline-block`作为该属性值[^4]。 ```css /* 将 span 设置成 inline-block */ span { display: inline-block; } ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值