已知宽度在哪里体现?与给出的代码是否矛盾?

已知宽度在哪里体现?与给出的代码是否矛盾?

这道选择题,不是给出  li:nth-child(1){flex-basis:200px;} , 那么"HTML"这个 li占的宽度不就应该是200 px吗,题目中说的占用宽度是325px,在代码中并没有体现出来啊,在给出的代码中,width和flex-basis都给出来了值,如何让它变成325px啊?按照给出的代码,不应该是800px/3吗?

在这里输入代码,可通过选择【代码语言】突出显示

正在回答

登陆购买课程后可参与讨论,去登陆

1回答

同学你好,理解的有问题。

flex-basis设置的是基础宽度,还有除去基础宽度,大盒子剩余宽度进行分配的,因为每个li设置了flex:1,就会均分剩余的li空间。

第一个基础宽度为200px,剩余三个基础宽度为100px,那么总共占据了500px;大盒子宽度为1000px,剩余500px,均分给4份,一个份为125px,那么第一个元素占据总宽度为200+125=325px,剩下三个分别占据100+125=225px 。

祝学习愉快!

  • 老师那这里第一个盒子要是不设置flex-basis,只设置width,那它之后(第一个盒子)还会参与剩余宽度的分配吗?

    搜索

    复制

    2022-05-15 23:44:43
  • 同学你好,会的,祝学习愉快~

    2022-05-16 11:33:52
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师