CSS布局模型

4 篇文章 0 订阅
在网页中,元素有三种布局模型:
1、流动模型(Flow)
default,就是块级元素都自上而下的分布,宽度都为100%。内联元素都从左到右水平分布。

2、浮动模型 (Float)
div、p、table、img 等元素都可以设置为浮动。两个 div 显示在一行的代码如下:
div{
    width:200px;
    height:400px;
    border:2px red solid;
    float:left;
}

3、层模型(Layer)
层模型有三种形式:
(1)绝对定位(position: absolute)
div{
    width:200px;
    height:400px;
    border:2px red solid;
    position:absolute;
    left:100px;
    top:50px;
}

(2)相对定位(position: relative)

(3)固定定位(position: fixed)

层模型中,各元素可能出现堆叠。堆叠顺序可以用z-index控制,z-index大者在上。z-index相同时,根据CSS声明顺序,靠后者在上。

[1] http://www.5idev.com/p-css_z_index.shtml

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值