块元素block与内嵌元素inline的基本特征

本文详细介绍了 CSS 中 display 属性的使用方法,包括 block、inline 和 inline-block 的特点及应用场景,并给出了前端开发的基本规范。

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

块的特征

  1、默认独占一行

  2、没有宽度时,默认撑满一排

  3、支持所有css命令


内嵌(内联、行内)的特征

  1、同排可以继续跟同类的标签

  2、内容撑开宽度

  3、不支持宽高

  4、不支持上下的margin和padding

  5、代码换行被解析


display:block        显示为块

使内联元素具备块属性标签的特性

display:inline        显示为内嵌

使行块属性标签具备内联元素的特性


display:inline-block;

Inline-block的特点和问题

特性:

1、块在一行显示;

2、行内属性标签支持宽高;

3、没有宽度的时候内容撑开宽度

问题:

1代码换行被解析

2、ie6 ie7不支持块属性标签的inline-block;


附前端编写规范:

1、所有书写均在英文半角状态下的小写;

2、id,class必须以字母开头;

3、所有标签必须闭合;

4、html标签用tab键缩进;

5属性值必须带引号

6、<!--html注释 -->

7、/*css注释 */

8ul,li/ol,li/dl,dt,dd拥有父子级关系的标签

9p,dt,h标签 里面不能嵌套块属性标签;

10a标签不能嵌套a

11、内联元素不能嵌套块;


  



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值