用标准件的方式来组装网页DIV布局-WEB标准网站设计心得

151 阅读 0 评论 100 点赞

我是靠谱客的博主潇洒枫叶，最近开发中收集的这篇文章主要介绍用标准件的方式来组装网页DIV布局-WEB标准网站设计心得，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

有这样一个想法，不知道可行么

例子：
布局中的左栏，它的属性有：｛居左，宽度，背景色，字体等等｝
如果把每个属性都做成一个标准件，然后这样组装起来使用
class="float width height background font padding....",通过多个class的标准件的引用来完成页面布局样式
先按需要定义好标准件如：

float标准件
.l{float:left}
.r{float:right}
.cl{clear:left}
...

width标准件
.w200{width:200px}
.w300{width:300px}
...

background标准件
.red{background:red}
.black{background:#000}
.white{background:#fff}
...
根据需要引用
class="l w200 red"［居左，宽度为200,背景红色］
class="r w200 white" ［居右，宽度为200,背景白色］

我现在自己写代码，最多就２个class来定义一个布局样式，感觉很方便