CSS-布局7-多列自动剧中

1、实现效果

  高度、宽度相等的盒子,在不同的的分辨率下,显示可以容纳的最多盒子,超出的盒子自动在下一行对齐排列,盒子整体剧中对齐。

2、实现思路

(1)设置容器盒子剧中对齐。
(2)所有的内容盒子,高度和宽度设置相等,全部左浮动。
(3)利用@media,在不同的分辨率下,设置容器盒子的宽度。
(4)利用伪元素清除浮动的影响。

3、源代码




    
    Document
    


    
header
1
2
3
4
5
6
7
8
9
10
11
12

你可能感兴趣的:(CSS-布局7-多列自动剧中)