css 布局的几种方式

参考:css 布局的几种方式

CSS布局

1 常用布局方法1
2、盒子模型
2
3、
block 有独立宽高 占据一行
inline-block 对外表现的像inline 对内像block 有宽高
inline 不能设置宽高 设置也没有意义
4、display 与 position
display 决定元素的类型 参考:
css之display 常用的几种属性
display:none
display:block
display:inline
display:inline-block
CSS-position常用属性
css定位
position 决定元素的位置
static —默认值
relative —相对定位
absolute —绝对定位
fixed —固定定位

position-absolute :
绝对定位元素相对于最近的非 static 祖先元素定位。当这样的祖先元素不存在时,则相对于ICB(inital container block, 初始包含块(根元素所在的包含块))。
因为默认是static所以一般我们使用绝对定位时给祖先元素(经常是父级元素)加上position:relative。
在布置文档流中其它元素时,绝对定位元素不占据空间。
绝对定位的元素则脱离了文档流。

flexbox 布局

1、
1

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值