浩哥小议网页布局

原文：http://bbs.zoomla.cn/showtopic-17908.aspx

　　谁也不会曲解width和height两个css属性的意思，但是它的含义变化着：
例如，某个id,class的元素可以具有width属性，#someid, .someclass{width:50px;}{width:100px;}
例如，发生在某个id元素下的特定class元素， #someid .someclass{width:50px;}

它们相似吗？不

id是一个人在彰显个性；class在描述共性。
至于第二例——这是最精彩的，因为它涵盖的是一种关系。

这里面有什么意思？

我可能想表达，我作为一个有个性的元素，我有自己的要求。我所说的是我要100px的宽度来展现我自己，如果我在这个页面中拿不到这个指标，那么我的表现将可能失常，我可能无法显示一些重要内容，我就最好不要出现在这里。或者，一个元素在某种意义上属于某种分类，还有别的元素也会属于这种分类，而我要描述这种分类。

当css的选择器涉及到多方，就更值得玩味了。这就好比一个人生存，我们的行为不尽相同，可能不是因为我们有个性，不是因为我们遵循某种原则，而是因为我们所处的环境，我身在一个社会，于是迫使我们必须这样做。就是说我这个学生，不是我上课不想讲闲话，而是我们学校，不让我们上课讲闲话；或者我的同桌，觉得我讲话吵到他。我学校就是我父级元素，我同桌就是我邻元素；我学校用子元素选择器限制我，我同桌用邻元素选择器限制我。那我果真不再讲闲话了吗？这就要看我的个性了。#我{上课讲闲话:是;}，那同学会把我赶出去，学校会给我批评。如果我是网页的某元素，我可能把别的元素挤走了，甚至被overflow:hidden。

又如现在我当老板了，所以理所应当我来决定公司怎么布局（阿波罗型企业）。各部门有什么职能，需要完成什么预算。这些有法可循，而不是靠员工们互相讨论自由发挥（大家都去float吧），既然要布局，那么无规矩不成方圆，否则不要布局。如果说一个列表，我希望它摆放在左边，并且有100px的宽度，那么值得注意，这些权利要交给父级元素，也就是通过#parent .sub{width:50px;}，诸如此类的形式。这个时候，不要说我把width直接写到子元素的样式里面去也可以啊，因为这样老板就威严扫地了。

所以布局，不是id选择器，不是class选择器，也不是标签选择器。布局是一种关系，是网页中的自然规律。

作者介绍：原华夏互联开发部成员浩哥(刊登此文目的不代表发哥同意观点，但欣赏作者的治学精神！）

　　

　　原文：http://bbs.zoomla.cn/showtopic-17908.aspx