image.png

    流式布局

    image.png

    image.png

    image.png

    弹性布局
    image.png
    image.png
    image.png

    父项属性

    image.png
    image.png

    image.png

    image.png

    image.png

    image.png
    image.png

    image.png

    子项属性
    image.png
    image.png
    分配剩余空间，如果其他元素已有宽度那么剩余空间就会减少

    image.png
    image.png

    image.png
    防止文字溢出
    image.png

    rem适配布局

    image.png

    image.png

    image.png

    image.png

    image.png

    媒体查询从小到大的写

    image.png

    image.png

    image.png

    image.png

    移动端css4 常见布局（流式 弹性 rem） - 图31

    移动端css4 常见布局（流式 弹性 rem） - 图32

    image.png

    image.png
    计算步骤
    image.png