发表于： 2017-03-02 12:20:16
1 585
分别使用的float和flex来布局
主要问题在于当宽度自适应时如何让高度等于宽度。
首先想到的是与宽度一样设置高度自适应，如要为每个九宫格设置百分数的高度，要使它有效，则要设置父元素高度，若父元素仍然为百分数则要依次设置每一级的父元素高度，全为百分数的话，最后一级html必须设置height：100%；的百分数高度才有效。
但是，这时不能让高度一直等于宽度，因此采用另外的方式。
由于padding、margin等都是基于本身元素来设置的，可以通过height：0；padding-bottom：（小格子的宽如30%）；来设置，此时就能保证高=宽
再想到若是子格存在子元素会怎样，实验了一下不影响什么
返回列表
评论