CSS标签分类(块元素 行内元素 行内块元素)

本文详细介绍了CSS中的块元素、行内元素和行内块元素的特性,包括它们的排列方式、宽高支持及应用场景。同时,讲解了如何通过display属性将元素转换为不同类型的布局,并提到了浮动元素时其表现行为的转变。对于网页布局和样式控制有很好的指导作用。

CSS标签分类(块元素 行内元素 行内块元素)

一、块标签

div p h1-h6 hr ul ol li dl dd dt form

1.支持宽高,自上而下排列
2.不受空格影响
3.一般用于其他标签的容器
4.默认宽度为100%(独占一行)。

二、行内标签

span i a b strong em sub sup u label br font

1.不支持宽高(宽高根据内容大小自动撑开),自左向右排列
2.受空格影响
3.不独占一行

三、行内块

img textarea input

1.支持宽高,自左向右排列
2.受空格影响
3.不独占一行

标签之间转换

display:inline(转为行内元素)
        inline-block(转为行内块元素)
        block(转为块元素)
        none(隐藏 不显示)

注意:当元素浮动(float)时会转化成行内块元素特点

链接: https://blog.youkuaiyun.com/makelucky/article/details/90414616.

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值