AI智能应用开发（Java）
鸿蒙应用开发
HTML&JS+前端
Python+大数据开发
人工智能开发
跨境电商
电商视觉设计
软件测试
新媒体+短视频
集成电路应用开发
C/C++
狂野架构师
IP短视频
块级元素、行内元素和行内块元素各自特点和区别
更新时间:2021年08月02日15时28分 来源:大阳城app官网入口 浏览次数:
下面我们介绍一下块级元素、行内元素和行内块元素的特点和转换方法。
1.块级元素(block-level)
（1）常见的块元素有哪些？
常见的块元素有
~、
、
- 、
- 等，其中标签是最典型的块元素。
（2）块级元素有什么特点？
·自己独占一行
·高度，宽度、外边距以及内边距都可以控制。
·宽度默认是容器（父级宽度）的100%
·是一个容器及盒子，里面可以放行内或者块级元素。
（3）注意问题：
只有文字才能组成段落，因此p标签里面不能放块级元素，特别是p标签不能放div。同理还有这些标签h1,h2,h3,h4,h5,h6,dt，他们都是文字类块级标签，里面不能放其他块级元素。
2.行内元素(inline-level)
（1）常见行内元素有哪些？
常见的行内元素有、、、、、
、、、、等，其中标签最典型的“行内元素”，也称“内联元素”。（2）行内元素有哪些特点？
·相邻行内元素在一行上，一行可以显示多个。
·高、宽直接设置是无效的。
·默认宽度就是它本身内容的宽度。
·行内元素只能容纳文本或则其他行内元素。
（3）注意问题：
·链接里面不能再放链接。
·特殊情况a里面可以放块级元素，但是给a转换一下块级模式最安全。
3.行内块元素（inline-block）
（1）常见行内块儿元素有哪些？
在行内元素中有几个特殊的标签——
、、
，可以对它们设置宽高和对齐属性，有些资料可能会称它们为行内块元素。 （2）行内块元素有什么特点？
·和相邻行内元素（行内块）在一行上,但是之间会有空白缝隙。一行可以显示多个
·默认宽度就是它本身内容的宽度。
·高度，行高、外边距以及内边距都可以控制。
4. 块级元素、行内元素和行内块元素的区别
元素模式 元素排列 设置样式 默认宽度 包含 块级元素 一行只能放一个块级元素 可以设置宽度高度 容器的100% 容器级可以包含任何标签 行内元素 一行可以放多个行内元素 不可以直接设置宽度高度 它本身内容的宽度 容纳文本或则其他行内元素 行内块元素 一行放多个行内块元素 可以设置宽度和高度 它本身内容的宽度 5. 块级元素、行内元素和行内块元素互转
块转行内：display:inline;
行内转块：display:block;
块、行内元素转换为行内块：display: inline-block;
猜你喜欢：
最新资讯
0 分享到：
javaee
python
web
design
cloud
test
c
netmarket
pm
Linux
movies
robot
uids
Python
jdbc
北京校区
大阳城·(中国区)官方网站入口-Macau App Station 版权所有Copyright 2006-2024 All Rights Reserved 苏ICP备16007882号营业执照增值电信业务经营许可证出版物经营许可证
苏公网安备 32132202001156号
- 、