前端笔试题7 flex-grow属性

tech2022-08-12  135

<div style="width: 100px; height: 10px; display: flex; flex-direction: row" > <div class="a" style="width: 30px; flex-grow: 1"></div> <div class="b" style="width: 20px; flex-grow: 1"></div> </div>

上述代码中a.width是多少? 答案:

55px

解析: 首先a和b共占了父盒子的50px,然后由于a和b都是flex-grow: 1所以剩余的50px将平分给a和b。 PS:第100篇博客,本来打算写一些总结或者最近的收获,但是目前还没有取得让自己很满意的成绩,所以暂时先搁置一下吧,“翻过那座山,才会有人听你的故事”,等自己的梦想实现了之后再回馈了,这里先用一到比较经典但简单的笔试题来实现自己的开学前博客三位数的flag,还有一个原因是我的CSS实在是有待提高,几乎每次都会被这方面的问题给难倒,因此就会出现两个分水岭,当问到CSS的时候含糊不清,一转到JS便来了精神,但是前端一定不能脱离了页面设计的基础,毕竟前端的出身就摆在这儿了。 最后,新学期,新起点,期待一个更强的自己。

最新回复(0)