HTML 布局教程

HTML布局通常情况下我们是采用<div>块级元素来进行合理的布局网页的。当然也可以使用<table>来对网页进行布局。但实际上<table>对用于某些数据的格式化显示会更好，而在网页布局中尤其是表格嵌套表格、多层嵌套的情况下，有时候就很难让编写代码的人理清楚其层次关系。

因此，在网页的美观设计中，网页布局很重要，直接关系到一个网页是否漂亮。记得05年的时候，我在一家网络公司担任技术经理，那时我们的老总（其实很年轻）经常的找一些网页布局很美观的网站来给我们做案例，让我们要向他们学习，比如雅虎、腾讯等的网站那个时候设计的很规整的，每一根线条每一个区块等，都是很漂亮的很美观的。以至于我们还能在今天看到很多以线条布局美的方式来构建网站的美观。给人的感觉是简洁而不简单的一种线条美。

建议：选择网页布局的时候尽量采用div+css的方式来对网页布局，而table表格方式的网页布局尽量将其修改成合理的div方式。

对于网页布局要想理清其层次关系，我们推荐一款工具，这款工具对网页开发人员来说，是十分重要的，我在2011年-2012年之间，经常给别人建设网站，大大小小从企业网站到个人网站应该有上万个网站吧。那时我一直使用的都是这款工具，其实这不是什么神秘的工具，相信大家都用过。这款工具是火狐浏览器中的一个附加组件——Firebug。如下图所示。

如图所示的Firebug插件

在火狐浏览器中安装firebug附加插件后，直接按照上图所示的菜单找到web开发者——>Firebug即可启动打开了。