发表于： 2019-06-21 17:00:56
1 556
今天完成了九宫格自适应，给方块增加了圆角，并设置了居中。
之前做了九宫格，是9个DIV，放在BODY里，运用float左浮动 ，限制了BODY的宽，设置成每行只能容纳三个方块的宽度。可以达到9宫格的效果。
但是在浏览器打开以后发现九宫格不能自适应，改变宽度，方块就乱了。
后来添加新的DIV，将9个DIV放入其中，设置宽度了，发现可以自适应。 关于这点不怎么明白，BODY为什么不能根据宽度自适应？百度无果。
百度了如何设置圆角，发现边框圆角属性是CSS3中 border的新属性，border：10px；然后为九宫格添加了圆角。
之后百度如何居中，学习到将div外边距margin值设为 auto，即可。
关于chrome浏览器，F12打开调试页面，别的没怎么看懂，就知道了可以在页面中更改代码，可以实时展现代码，输错会有提示，感觉很不错。
返回列表
评论