打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
CSS的 行内元素 和 块类元素

块级元素

​1.总是从新行开始
​2.高度、行高、外边距以及内边距都可以控制
​3.宽度默认是浏览器的100%
​4.可以容纳内联元素以及其他块元素

行内元素

​1.和相邻元素在一行上

​2.高、宽无效,但是水平方向的padding和margin可以设置,垂直方向无效

​3.默认宽度就是它本身内容的宽度

​4.行内元素只能容纳文本或其他行内元素(a除外)

​注意:

​1.只有文字才能组成段落,因此p里面不能放置块级元素,同理还有这些标签h1-h6,dt等,它们都是文字块级标签,里面不能放置其他块级元素

​2.链接里面不能再放置链接

块级元素和行内元素的区别

块级元素的特点:
1.总是从新行开始
2.高度、行高、外边距以及内边距都可以控制
3.宽度默认是浏览器的100%
4.可以容纳内联元素以及其他块元素
行内元素的特点:
1.和相邻行内元素在一行上
2.高、宽无效,但是水平方向的padding和margin可以设置,垂直方向无效
3.默认宽度就是它本身内容的宽度
4.行内元素只能容纳文本或其他行内元素(a除外)

行内块标签 inline-block

在行内元素中有几个特殊的标签--<img />、<input>、<td>,可以对他们设置宽高和对齐属性,有些资料可能会称它们为行内块元素。
特点:
1.和相邻行内元素(行内部)在一行上,但是之间会有空白间隙
2.,默认宽度是它本身内容的宽度
3.高度、行高、外边距以及内边距都可以控制

标签显示模式转换 display

块转行内:display:inline;
行内转块:display:block;
块、行内元素转换为行内块:display:inline-block;
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
标签显示模式
display属性常用的三种值:block、inline
web前端教程:CSS标签的分类、及显示模式
HTML前端开发盒模型、元素标签
css中行内元素和块级元素的区别
HTML标签分类方式
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服