页面布局思路

网页布局是前端中一个基本概念，当一张空白的网页呈现在我们眼前时，如何把文字，图片等网页元素有规则地排列在网页中，就是网页布局要考虑的重要方面。好的网页布局能够让前端开发人员更好地把握网页的整体结构，提高代码的书写效率，复用性，和后期维护。作为初学者，我们应该重视页面布局，而不是简单为了达到页面效果，而不考虑页面的布局，毕竟页面布局和代码的质量是息息相关的。经过学习，我总结了一些自己的理解：

1.要有整体意识。当我们在页面布局时，首先可以从整体出发，了解页面的大概内容，清楚应该把一个网页分成几个大的模块。

2.从外向内，层层递进。写清标签的嵌套关系，简单明了的层级关系，不仅便于我们查找页面内容，方便在出现错误时能够快速地修改，而且在书写js代码时更好的找到我们所需要的元素。对后期其他开发人员在修改代码时提供了便利，减少了工作量，提高了工作效率。

3.模块化

在把握页面大模块的同时，分析组成大模块的局部，把局部模块化，可以为我们排除很多其他页面元素的干扰，降低页面在出现错误时，可能的影响范围。保证我们在写代码时的思路。

4.命名规则

在给页面元素命名时，尽量做到望名知意。一个只有自己知道的名字，是一个不合格的名字。因为我们的代码，写出来不只是给自己看的，后期还需要大量的维护和更新。如果没有意义的名字太多，就会大大影响后面人的维护，这也能体现我们的职业素养。毕竟我们自己也不希望接到存在同样问题的项目。最好是在命名时还要体现元素的嵌套关系，这样在书写CSS代码时，就会便捷许多。 下面是一个实例，辅助理解。

原文链接： 页面布局思路