CSS中display和position的属性值有哪些?

display具有以下特性 

display:none、inline、inline-block、block、table、inherit、flex

1、none:就是隐藏,不会占用文档流位置,不会占用空间(其他元素会占用他的元素)

2、inline:行内元素

3、inline-block:行内块元素,也即有块元素的一些特性,可以设置宽度、高度(width、height)边距等等

4、block:块元素,独占一行,可以设置宽度高度(width、height)边距等等 

5、table:表格相关,众所周知table有一些特定的标签:table、tr、th、td、tfool等等。可以用div等元素来实现,需要将元素的display设置成table-*就行

6、inherit:也即继承,

7、flex:弹性盒子,也成为弹性布局


position具有以下特性

position:absolute、fixed、relative、inherit、static(默认)、sticky、unset

1、absolute:绝对定位,对象脱离正常文档流,使用top,right,bottom,left等属性进行绝对定位。比较多的层叠通过和z-index属性定义。

2、fixed:固定定位,对象脱离正常文档流,使用top,right,bottom,left等属性以窗口为参考点进行定位,当出现滚动条时,对象不会随着滚动。

3、relative:相对定位,对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。

4、inherit:继承,规定应该从父元素继承 position 属性的值

5、static:默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值