首页 > 试题广场 >

实现一个两列等高布局，讲讲思路

[问答题]

实现一个两列等高布局，讲讲思路

名字被占用的Aimee

子元素一个指定高度，一个不指定，父元素使用display:flex，align-item:stretch，

发表于 2020-03-12 12:49:03 回复(0)

Thro💥

border来当做另一栏，也是美美的

发表于 2019-09-27 15:46:38 回复(0)

拯救世界的光太郎

方法一：纯css（内外边距相互抵消，再加上一个overflow:hidden即可）

.wrap{overflow: hidden;}

.left{width: 100px; height: 200px; float: left;background: #149BDF; padding-bottom: 5000px; margin-bottom: -5000px;}

.right{width: 200px; height: 400px; margin-left: 150px; background: #32CD32;}

方法二：jQuery（将right的高度赋给left，因为函数仅执行一次，使用resize实时监控窗口大小变化，窗口一旦变化就再一次获取高度并赋值）

function setHeight(){

____var h = $('.right').height();

____$('.left').height(h);

}

setHeight();

$(window).resize(function(){

____setHeight();

})

编辑于 2021-03-05 19:38:16 回复(0)

火柴哥

<p>用border当作一栏</p>

发表于 2020-06-06 12:12:45 回复(0)

提交观点

问题信息

上传者：小小

难度：

4条回答 72收藏 1208浏览

扫一扫，把题目装进口袋