html 的块级（block-level）元素和行内（inline）元素

最新推荐文章于 2021-11-05 14:46:38 发布
最新推荐文章于 2021-11-05 14:46:38 发布
阅读量2.6k 收藏 1
点赞数 1
分类专栏： html 文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hefrankeleyn/article/details/85260424
版权

    块级元素（block-level）和行内（inline）元素是历史上对html元素标签的分类，html5将"block-level"和“inline”这两个概念删除了。

一、块级元素（block-level）

    块级元素会页面中出现一个可见的块——它们将出现在新的一行中，无论前面的内容是什么，之后的内容将出现在他们的下一行。块级元素不能嵌套在行内（inline）元素中，但块级元素能够嵌套在另一个块级（block-level）元素中.

     块级元素只能出现在<body>元素中。下面是所有块级元素的标签：

二、行内元素（inline）

    行内元素不能产生一个新行。例如：<a>、<em>、<strong>等。

    内容模型：行内元素里面只能放数据和其他的行内元素，不能放块级元素在行内元素中。

    行内元素不从新行开始，只占用所需的宽度。下面是所有的行内元素。

    通过css的一个属性display，可以改变其html展示的外观，但是css的这个属性并不能改变类别和内容模型，例如，通过css的display将<span>转变为“块”，仍然不能将<div>嵌套如<span>里面.

鲲鹏飞九万里
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
常用的块级元素（block）、行内元素（inline）以及行内块元素（inline-block）的解析
hchhan的博客
08-20 1341
转载自：https://blog.csdn.net/cc18868876837/article/details/78060347 一.块级元素： 不废话，直接上图（div、p、h1~h6、ul、ol、dl、li、dd、table、hr、blockquote、address、table、menu、pre，HTML5新增的header、section、aside、footer等） 从浏览器的...
【详解html元素】块级元素（block）、行内元素（inline）以及行内块元素（inline-block）
xiaobai_IT_learn的博客
07-19 539
1.
HTML中的元素分类
C__Two的博客
06-11 1659
Html中的元素分类 Html元素大致可以分为3类，分别为：块级元素（block），行内元素（inline），行内块元素（inline-block） 1.块级元素（block） 常见的块级元素：div，p，form，hr，table，h1…h6，dl，dt，dd，ul，ol， 块级元素的特点： 默认情况下都会独占一行，按照从上到下的顺序进行流式布局 块级元素可以直接设置宽度和高度，元素在不设置宽度的情况下，它的宽度是父元素的100% 遵循盒模型的所有规则，一般作为其他元素的容器（除p标签） 2.行内元素
HTML学习——块级元素和行内元素的区别
Insect_17的博客
11-05 236
HTML中的元素可以分成两大类：块级元素(block)和行内元素(inline)。 1、块级元素：大多为结构性标记 <address>...</adderss> <center>...</center> 地址文字 <h1>...</h1> 标题一级 <h2>...</h2> 标题二级 <h3>...</h3> 标题三级 <h4&gt...
CSS中的块级元素（block）与行内元素（inline）
weixin_30492047的博客
12-26 91
css中有3种基本的定位机制：普通流（相对定位实际上看做普通流定位模型的一部分）浮动（float）绝对定位（固定定位是绝对定位的一种）所以在学习浮动之前，我们先要了解块级元素与内联元素（行内元素）。块级元素：块级元素一般当做容器使用，既可以容纳内联元素也可以容纳块级元素，例如div和p。常见的块级元素:（1）div：主要用来进行框架布局。（2）h1～h6：用来设置不同级别的标题。（3）p:创建段落...
行内元素和块级元素 displayDemo.html
04-13
在HTML中，元素被分为两种主要类型：行内元素（Inline Elements）和块级元素（Block-level Elements）。这两种元素在页面布局中起着至关重要的作用，它们各自有不同的特性和使用场景。 1. 行内元素（Inline ...
css中行内元素和块级元素的区别
09-27
此外，`display: inline-block`还可以创建一种“行内块级元素”，它结合了行内元素和块级元素的特性，可以在一行内显示，同时可以设置宽高和内外边距。 5. **总结** CSS中的行内元素和块级元素是网页布局的基础，...
CSS块级元素与行级元素详解
09-27
此外，还有内联块级元素（Inline-block Elements），如`<img>`和`<button>`，它们既有内联元素的特性（在同一行内显示），又有块级元素的特性（可以设置宽度和高度）。 在HTML5中，引入了一些新的元素，如`<header>...
标签 li 是不是块级元素分析
09-28
在HTML中，元素被分为两种主要类型：块级元素（Block-level）和内联元素（Inline-level）。块级元素通常会在新的一行开始显示，并占据页面的整个宽度，它们可以包含其他块级或内联元素。而内联元素则只占据其内容所...
浅谈html标签的显示模式(块级标签,行内标签,行内块标签)
12-14
- 行内块元素如`<img>`和`<input>`，它们结合了行内元素和块级元素的特点，可以设置宽度和高度，同时能和其他行内元素在同一行显示。不过，行内块元素之间可能存在间距问题，需要额外处理。 - 可以通过CSS的`...
html哪些是块级元素，哪些是行内元素
WXLeader的博客
07-09 2787
块级元素：块级大多为结构性标记 <address>...</adderss> <center>...</center> 地址文字 <h1>...</h1> 标题一级 <h2>...</h2> 标题二级 <h3>...</h3> 标题三级 <h4>...</h4> 标题四级 <h5>...&lt...
HTML块级元素和行内元素
weixin_30779691的博客
04-30 200
块级元素(block-level) 每个块元素通常都会独自占据一整行或多整行，可以对其设置宽度、高度、对齐等属性，常用于网页布局和网页结构的搭建。 常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等， 其中<div>标签是最典...
常用的块级元素（block）、行内元素（inline）以及行内块元素（inline-block）
weixin_43312083的博客
08-27 375
https://blog.csdn.net/cc18868876837/article/details/78060347 https://blog.csdn.net/R_banyan0820/article/details/80976114 https://blog.csdn.net/hsd2012/article/details/51009747 以上三个链接均为相关链接 ...
HTML中块级元素和行内元素以及行内块元素详解
weixin_45377813的博客
10-10 477
你是否有以下困惑： 为什么有些标签能够设置宽度和高度，而有些标签不能设置呢？ 为什么有些标签能够独占一行，而有些标签一行可以放很多个呢？ 可我就想让这个标签可以设置宽度和宽度并且自己不占满一行呢？ 问题1解答： 为什么有些标签能够设置宽度和高度，而有些标签不能设置呢？ ---因为在html中块级（block）元素和行内块（inline-block）元素可以设置宽度和高度 ---行内（inline）元素不可以设置宽度和高度 例如: <html> <style>
HTML-块级元素与行内元素(block-level & inline element)
a19576的专栏
10-20 300
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Block-level_elementshttp://blog.csdn.net/hyb1234hi/article/details/78218563 http://www.cnblogs.com/greenal/archive/2013/01/05/2845513.html
Ozone基于Block level的EC方案设计
走在前往架构师的路上
11-05 749
文章目录前言Ozone EC概述Ozone Container Group以及CGI 前言 在之前文章中，笔者写过一篇关于Ozone EC方案设计的文章(Ozone的Erasure Coding方案设计)，不过当时那篇文章讨论的EC设计方案主要在Container级别以及Block级别做EC实现的方案对比，社区并没有敲定选用哪种最终的具体方案设计。最近社区更新了Ozone EC最新的设计方案，在Block级别做最终的实现方式，本文笔者聊聊此方案的实现细节。 Ozone EC概述 说到EC以及Ozone的
HTML基础知识（一）
CongliYin的博客
07-10 257
一、基础知识（一）1、HTML主体<body></body>2、HTML标题HTML标题通过<h1>…<h6>进行定义。 <h1>这里是一级标题</h1>3、HTML段落<p>这里是段落内容</p>4、HTML链接<a></a> 实例：<a href=”http://www.baidu.com”>百度链接</a> 需要在href属性中指定链接的地址。5、HTML图像<img src=”xx.j
css中标签显示模式、块元素、行内元素、行内块元素、显示模式转换
专研前端，探索后端
04-15 465
标签显示模式display: HTML标签一般分为块标签（块元素：block-level）和行内标签（行内元素：inline-level）两种类型，但是还有第三种说法行内快元素：table-row-group：设置元素为表格行组显示，display值总结如下表： 块元素block-level： 独占一行，可以设置宽度、高度、对齐等属性，常见的块标签：h1~h6、p、div、ul、ol、li等。 行内元素（内联元素）inline-level: 一行可排列多个行内元素，一般不能设置宽度、高度、对齐等属性，但是
深入理解inline元素，block-level元素和display属性
jujuwuju的专栏
07-23 990
行内元素和块级元素有什么异同？ 可能你觉得这是一个老掉牙的问题，但其实并没有那么简单。 对于初学者来说，当遇到面试官问到这个问题的时候，脑海里的第一印象是css的display属性，值为inline时为行内元素，值为block时为块级元素，那值为inline-block时呢，元素是块级行内元素吗？ 其实我们看问题的角度从一开始就错了，错误地站在了css的角度，而真正正确的是站在html的角度。因为这里的元素，本质上是指html的DOM元素。 下面我们就3个原理展开深入： 深入理解inline元.

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值