DIVITIS和使用多个类

我在CSS中创建了许多基本的类，例如“圆形”，“隐藏”，“红色”，“浮动”等......我使用它们就好像它们是乐高棋子一样得到想要的结果。为什么？因为我的网站是以喧宾当今的形式呈现的，所以他们可能有多种选择。我不想为每个可能的组合创建一个单独的类，因此我决定创建多个类并为每个div分配五个甚至六个不同的类。另一方面，我听说了DIVITIS问题。我知道我使用的所有div都是必需的。但我的问题是：

是否有这些问题？我的意思是，为使其在不同设备上，或渲染时间，等...
DIVITIS和使用多个类

使用例如：

<div class="block spgreen toprounded"> 
<div class="boxnm left nmquart blue mkPln btn topLrounded"><h1 class="pdg txtCenter">Inicio</h1></div> 
<div class="boxnm left nmquart green mkPln btn active"><h1 class="pdg txtCenter">Navegar</h1></div> 
<div class="boxnm left nmquart orange mkPln btn"><h1 class="pdg txtCenter">Aprender</h1></div> 
<div class="boxnm left nmquart red mkPln btn topRrounded"><h1 class="pdg txtCenter">Compartir</h1></div> 
</div>

编辑：
每个CSS类没有超过5个属性。

编辑2：
我根据我的设计的 “块” 和 “盒子”。块有自动溢出，并且框始终是浮动的。它们可以有4种不同的尺寸（宽度）：25％，50％，75％，100％。然后，我创建了一个“魔法本质”的列表，如：阴影，圆角等...为了控制所有的东西为我。问题是，如果这可能是“错误的”谷歌索引我的网页或Android手机来呈现它，或或或...

一些CSS可能是：

div.block{ /* Block lines (will contain floated boxes) */ 
position:relative; 
overflow:auto; 
} 
div.box{ 
position:relative; 
margin:.5%; /* +1% (both-sides) */ 
} 
div.box.nm{ 
margin:0; 
} 

/* Position */ 
.center{ 
margin:.5% auto !important; 
} 
.left{ 
float:left; 
} 
.right{ 
float:right; 
text-align:right; 
}

来源

2012-08-17 Kenedy

如果你分享了CSS，我们会有更好的想法。 – jackwanders 2012-08-17 13:45:52

重新“动态渲染”。你是说，对于一个特定的div，div的外观/颜色等是通过用户配置来设置的？ – 2012-08-17 13:50:33

@jackwanders更新的问题。 – Kenedy 2012-08-17 13:54:10

我个人比较喜欢的名字CSS类它们是什么，而不是他们看什么例如：

<div class="menu">... 
<label class="caption">...

I w应该创建一个设置为红色的类定义，并将所有的类设置为它。

例如.menu，.menu .caption {color：red};

等等等等

你可以定义一个完全不同的风格和CSS命名这种方式保持真实。如果您的课程名称为red,rounded等，那么您就被这种样式所困，否则名称变得毫无意义。

当然，这可能不符合你的“动态渲染”，但你没有说明这是什么。

来源

2012-08-17 13:44:44

这不是关于Divitis，我想。 divitis的古典（好，更多 - 少 - ）定义是关于在不需要的地方使用包装器。当有人使用过多的泛型容器，用类定义它们的语义时，实际上它被称为classitis。）

但我想在此注意另一个问题：使用此约定，您实际上已将CSS作业（样式）移回到HTML中。例如，如果您需要更改某个块的颜色，则不要触摸CSS文件 - 您自己编辑HTML（交换“红色”类为'橙色'）。至少可以说，我不认为CSS和HTML应该如何协作。）

取而代之的是在我们的环境中我们使用逻辑块，但它们就是它 - 逻辑块。我们并不孤单：如果仔细研究Twitter Bootstrap框架的惯例，我想你会看到相同的方法。 HTML中的逻辑块，CSS中的样式 - 当然，很少使用通用块。就我而言，一个例子就是Bootstrap的图标样式：当使用<i>元素代替更通用的spans时。

来源

2012-08-17 13:48:15 raina77ow

嗯，但有另一部分我没有说过：所有的HTML都是由PHP函数生成的，它根据颜色，大小等几个参数创建盒子......想法是：如果我想编辑我的页面，我只需编辑生成HTML（用CSS设计）的PHP文件。问题：以这种方式为用户生成内容是否有任何错误？（浏览器兼容性，渲染等）... – Kenedy 2012-08-17 13:59:38

@Kenedy如果你需要编辑PHP文件来改变_style_，你真的认为它是一个好处吗？至于你的直接问题，我认为它不会带来直接的负面影响（毕竟风格是一种风格），但我认为维护和更新这个网站并不容易 - 尤其是随着时间的推移... – raina77ow 2012-08-17 14:05:38

然后我会尝试使用Jon的方法，它看起来更干净。感谢您分享知识:) – Kenedy 2012-08-17 14:07:30

DIVITIS和使用多个类

回答

相关问题