<div class="table"> <div class="accordant"> <div class="box"> <p>这是一个box</p& ...
<div class="table"> <div class="accordant"> <div class="box"> <p>这是一个box</p> </div> <div class="box"> <p>这是一个box</p> </div> <div class="box"> <p>这是一个box</p> </div> </div> </div>
html{ font-size:10px; } body{ font-size:1.4rem } .box{ background:yellow;margin:0 1rem;width:33.33%;padding:1rem; } .box:nth-child(2){ height:5rem;background:yellowgreen; } .accordant{ display:table-row; } .table .accordant{ display:table-row; } .table .accordant .box{ display:table-cell;vertical-align:middle;text-align:center; }
最终效果图:
原标题:如何实现三个div都自适应(滴滴面试题)
关键词:div
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。