网页布局的时候先写HTML还是先写CSS

很多朋友都有自己的习惯，有的人喜欢先写CSS，有的人喜欢先写HTML，那么网页布局最科学的写法流程是什么呢？今天来给大家一起分析一下

网上有很多种对此的答案：先写HTML后写CSS；先写CSS后写HTML；两者同时写。

我在平时做html页面是选择的两者同时进行，首先先建立好网站大致目录文件，如imges:存放页面图片；js： 存放JS脚本语言，而CSS文件我建议直接放到images文件夹里，这样好处以免，在调用图片背景时候把图片路径搞错了，再是就是方便维护图片名称；自然html页面则放到根目录下。

然后我们先写HTML中的最基本的布局部分，都是用DIV，然后直接在DIV里加入ID或CLASS(ID与CLASS区别)，这些布局部分包括外套部分，头部分，中间部分，左，中，右，版权部分等。其中头部、中间、底部基本都是大概页面的通用部分，大部分网页都是由这3个大部分组成。我们把这些部分用ID或class命名好后，再到css样式文件里写对应的css样式属性。而在css写前我们要把全局全站的div、h1、h2、字体、字体大小、li等等样式定义好这里不就不详细讲了，如想了解请进我用的全局定义css模板了解下载使用，这样以来就不用每次新做网站的时候而重新定义，而直接拷贝通用的基本CSS样式定义模板即可使用。

一般在制作DIV+CSS的时候新手最好是同时进行html与CSS，这样可以减少错误。在制作中如果经验不是很好的时候，希望在制作过程中多种不同的品牌版本浏览器中测试是否兼容有没有出现在这个浏览器中显示正常，而在另外浏览器却出现显示不全错乱等。从而解决和了解掌握基本兼容问题，积累宝贵的DIV+CSS技术经验，并习惯做上笔记，以免日后忘记。

下面我们了解下先写html然后再写css：
为什么说有些有经验者对新手说我们不可能一次性把HTML部分写好呢？因为人都是可能犯错误的，可能你的想法写的过程就是有问题的，或者为了浏览器的兼容性问题，有些是你由于经验的不足没有提前预料到，所以当你写样式时发现了问题时就有可能要改动你的HTML的代码。如果先把html写好后可能页面大了后，会忘记你在html中想到的对css属性布局选择。

接着我们了解下先写CSS然后再写html：
对应有经验的CSS制作者来说，这种是比较有可行性的比起先写html后写css来说。为什么呢？我们知道CSS的继承父级属性特点是相当好，这样以来我们可以通过这点来先写CSS。但是对于新手来说不能这样，如果你先写好CSS后在回到html页面写是回头看你写的css及会忘记怎么调用选择了，因对CSS兼容问题没有经验而同时这样兼容性也相当差。而有经验者通过父级继承特点来排版css文件代码，而返回html时调用CSS中class类和id时很清楚不容易出错。

通过以上对先后的写法都作出了介绍与解释，但是值得说的一般制作页面时候我们通常是采用两者同时进行+浏览器测试进行。两者同时或半先写css再写html或相反的半先写html再写css是非常好的，这样不容易出错，以免出错后浪费时间修改。

以上的说法不一定完全是正确但是通过以上想告诉DIV+CSS制作开发者，无论是先写html还是先写CSS这个并不重要，重要是你对div+css的喜爱加在日常不停的练习，你也可以HTML/CSS同时进行，都是可以的，看你的习惯。但你开发制作多了自然会总结出适合自己，而开发快的方法来。希望以上对你有帮助。

相信看了这些案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

相关阅读：

CSS的文本字体颜色如何设置

在HTML的网页布局里div与span有什么区别

css里的font文字怎么设置

以上是网页布局的时候先写HTML还是先写CSS的详细内容。更多信息请关注PHP中文网其他相关文章！