欢迎来到酷云建站平台,全网营销云系统加盟中心!

海量企业网站模板 · 任您选择

美出特色,精出品质,一切为了企业更好的营销

隐藏侧栏
Beta
转载

谈谈css左右等高的几个方法

       建站经验     2016-02-24     eycms     43     0    

等高布局的使用场景有很多,很多时候为了满足某列的背景或者边框跟外框高度一样,并且不受其他列动态变化高度的影响。一般我会考虑几种方式:

一、负margin实现

 代码如下复制代码

.row-wrap {
overflow: hidden;
}
.row1, .row2, .row3 {
padding: 10px;
margin-bottom: -1000px;
padding-bottom: 1000px;
}
.row1{
width: 120px;
background: #F2F2F2;
float: left;
}
.row2{
width: 300px;
background: #81C0F2;
color: #FFF;
float: left;
_margin-right: -6px; //fix ie6
}
.row3{
width: 150px;
background: #FF6600;
color: #FFF;
overflow: hidden;
zoom: 1; //触发haslayout
}

<div class="row-wrap">
<div class="row1">
<p>悉尼洲际...</p>
</div>
<div class="row2">
<p>酒店离悉尼海滨...</p>
</div>
<div class="row3">
<p>在砂岩商场...</p>
</div>
</div>

 


--结束END--

本文链接: http://www.83703228.cn/station/experience/1387.html (转载时请注明来源链接)

 
本文标签: 全部

下班PC阅读不方便?

手机也可以随时学习开发

微信关注公众号“酷云”
"酷云平台前端开发教学"
每日干货技术分享
 

×

成为 酷云平台 代理商!

关注

微信
关注

微信扫一扫
获取最新优惠信息

酷云平台公众号

客服

联系
客服

很高兴为您服务
尊敬的用户,欢迎您咨询,我们为新用户准备了优惠好礼。 咨询客服

联系客服:

在线QQ: 3206174

客服电话: 0516-83703228

售前咨询 售后服务
在线交谈 智能小云

工作时间:

周一至周五: 09:00 - 17:00

WAP

手机
访问

移动端访问
手机上也能选模板

酷云平台手机端