【规整】网页怎么做才不会外行？

长话短说哈，今天晚上我跟同学们去喝酒了，所以文章会短一些。

网页怎么做才不会外行？这句话的意思就是说，你做的网页在浏览器里打开，像我这样的人扫一眼，就能判断出这是一个新手的练手作品？还是一个工作能力可靠的人做的。

那我是怎么判断的呢？当然会有许多标准，其中之一，就是网页各个模块之间的间距。你去看京东也好，淘宝也罢，你仔细观察它们的各个模块之间的间距，在同一个页面上的间距，一定是相等的。

而许多前端新人，他们经常不会注意到这个细节。他们的网页的间距是不相等的，这就包括行间距，字间距，模块间距，其实整个网页怎么样做到横平竖直？就是各种间距都是相等的，这样整个网页看起来就有一种规划的美感。

<!-- -->

那怎么做到这一点？

至少有二种办法。

一、你在做页面的时候，就把各种间距都写好定好。但这样会比较累，而且不利于维护。意思就是说，如果某天设计UI有变化，那么你需要一个一个的去调整。

二、就是把间距在css中定义为一个单独的样式，在需要间距的地方去加载。因为class可以加载多个css定义。

我个人主观认为，第二种方法会更好些。因为css也是需要模块化的。

<!-- -->

把页面的间距定好，至少会有二方面的好处。

一、会让你的页面看起来不外行，这在本文的标题中已经写了。

二、你可以把你的css定义，设计为一个css模块的二叉、多叉树的结构。

这在面试的时候毫无疑问的会成为你的加分项，毕竟架构设计的思路和实施在前端实践中的地位越来越重要。而一个懂、理解前端架构的前端开发，他的能力、潜力、前景会更大些。

所以同学们，相信我，不要对css的结构设计漫不经心。