网页布局中结构与表现分离的原则

      在网页布局中，HTML是结构，CSS是表现，Javascript是行为。

      拿到一个网页的设计图时，首先应当关注网页的文字内容及内容模块之间的关系，把重点放在编写 Html 语义化的代码上，而不要过多的考虑设计图上的布局样式，在 Html 按内容编写完以后再考虑样式如何实现，力求不改变样式结构的基础上完成要求的视觉效果，从而减少 Html 和 CSS 的契合度。

      例如：使用 text-indent 可以实现文本内容的缩进，而不需要利用定位来实现效果，也不是用 html 标签单独加一个无语义的span ，这样就不是结构与表现分离的做法了。

       这两个微博发言框实现了相同的效果，而代码冗余程度不同。第二种遵循了结构与表现分离的原则，没有使用过多的div，更加简洁。

.demo03{width:458px;padding:20px;background:#39F;border: 1px solid #ccc;margin-left: 100px;position: relative;}
.demo03 img{float: left;margin:-20px 0 0 -100px}
.demo03 p{font-size: 16