html中相对定位怎么写,html中相对定位与绝对定位

来讲讲html中相对定位与绝对定位,有的后端同学对html的相对定位与绝对定位,不太熟的福利来了,本篇对于html的相对定位与绝对定位讲的很详细呢!

html是整个文档空间,body是html中的文档空间, body与html相差9cm左右

postion中的相对定位:relative

postion中的绝对定位:absoute

相对定位:

当没有参照物的时候,相对定位是相对与body定位的

绝对定位:

当没有参照物额时候,绝对定位是相对与html定位的

使用margin的时候,是占用文档空间的,一般用在相对定位使用

使用top,left,right,button的时候,是不占用文档空间的,看情况使用

我们一般是在相对里面套用绝对来进行项目的开发#divAddress{

position: relative;

margin-top: 48px;//这就是刚才提的当使用margin的时候才能进行下面的相对

width: 370px;

height: 66px;

border-bottom: 1px #c1c1c1 solid;

}

#img1{

position: absolute;

float: left;margin-top:2px;

width: 24px; height: 24px;

}

.address{

position: absolute;

margin-left: 34px;

font-size: 20px;

color: #c1c1c1;

}

#peoplePost1{

position: relative;

margin-top: 12px;

width: 370px;

height: 40px;

border-bottom: 1px #c1c1c1 solid;

}

#people1{

position: absolute;

float: left;margin-top:2px;

width: 24px; height: 24px;

}

.people2{

position: absolute;

margin-left: 34px;

font-size: 20px;

color: #c1c1c1;

}

#post1{

position: absolute;

float: left;margin-top:2px;margin-left:192px;

width: 24px; height: 24px;

}

.post2{

position: absolute;

margin-left: 222px;

font-size: 20px;

color: #c1c1c1;

}

address

地址 : 输入上海市卢湾区卢湾榜路758弄10号1011室

people

联系人 : 张三

post

职位 : 业务经理

上面也就是相对和绝对结合的html代码,以上就是本文的所有内容了,希望可以给大家带来帮助!

相关推荐:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值