根据数据库结果在CSS中更改DIV颜色？

我想根据我正在运行的数据库中的一些真/假值更改DIV的背景颜色。这可以在CSS中完成，或者当我涉及到这个时，我不得不使用内联CSS？我想出了根据数据库结果在CSS中更改DIV颜色？

一种解决方案是，我已经创建了几个（4-5）班被称为但是类都有相同的CSS规则，除了颜色和只是让我觉得这是多余的，一浪费空间。

我也研究了，似乎你可以在CSS PHP变量。但我想这样做，而不是单独的.css/.php文件在标题中链接的原因有几个。这可能吗？

也许我可以解释一些代码更好。下面是我想要去的概念，我想知道如果我能做到这一点，而不外部样式表？：

<hml> 
<head> 
div.content { 
background-color: <?php echo $LegendColor; ?>; 
border-style:solid; 
border-width:2px; 
border-color: #000; 
margin: 10px 0px; 
} 
</head> 
<body> 

<?php 

/* After some database connection & query*/ 

while ($row = mysql_fetch_assoc($result2)) { 


$var1 = $row["db_boolean_var1"]; 
$var2 = $row["db_boolean_var2"]; 
$var3 = $row["db_boolean_var3"]; 
$var4 = $row["db_boolean_var4"]; 

if($var1 == TRUE){ 
    $LegendColor = "#F00"; 
    } 
    elseif ($var2 == TRUE){ 
     $LegendColor = "#F0F"; 
     } 
     elseif($var3 == TRUE){ 
      $LegendColor = "#999"; 
      } 
      elseif($var4 == TRUE){ 
       $LegendColor = "#0F0" ; 
      } 
          else{ 
           $LegendColor = "#FFF"; 
           } 




echo "<div class=\"content\"> 
</br> 
</div>"; 

} 

</body> 
</html>

来源

2010-10-07 Tek

为什么不

div.content { 
    border-style:solid; 
    border-width:2px; 
    border-color: #000; 
    margin: 10px 0px; 
}

，然后添加一个额外的类取决于数据库的结果，例如在div

<div class="content <?php echo getContentClass($row) ?>"> ... </div>

其中getContentClass()是翻译这些布尔值转换为有意义的CSS类，而不是具体的颜色值的辅助功能。

function getContentClass(array $row) 
{ 
    return implode(' ', array_intersect_key(
     array(
      'db_boolean_var1' => 'state1', 
      'db_boolean_var2' => 'state2', 
      'db_boolean_var3' => 'state3', 
      'db_boolean_var4' => 'state4' 
     ), 
     array_filter($row) 
    )); 
}

然后，只需将这些CSS类添加到常规样式表中，例如，

div.state1 { background-color: red; color: inherit }

这样，一切都清楚分开的，你不要不得不求助于内嵌样式。

编辑：请注意类的名称，如上面所示是没有意义的。类名不像红色或黑色，因为它们与演示文稿相关。尝试使它们与内容相关，例如像无效，错误，付费，自由，活跃等等。

来源

2010-10-07 09:24:18 Gordon

感谢您的建议！我会试着看看这些建议中哪一个最适合我。每当我完成测试，我会回来！ – Tek 2010-10-07 09:37:44

我不得不说，这工作很好。非常感谢！你已经接受了所有努力的答案，并且非常全面。:)编辑：我忘了提及具有有意义的CSS名称与数据库功能相匹配的说明使其更易于理解和理解。伟大的提示！ – Tek 2010-10-07 10:14:45

Brillant！高明！高明！高明！ – user18490 2014-07-26 18:18:28

您可以使用许多类的HTML元素使刚刚“颜色“类需要改变。要做到这一点，内联班是最好的解决方案。

<element class="thing red" /> 

element.thing { general rules } 

.red { color:red; }

来源

2010-10-07 09:22:26 MatTheCat

正确，但在这种情况下，只会有一个布尔激活（TRUE）。永远不会有多于一个布尔标记为TRUE，我的数据库结构反映了这一点。 “其他”在那里以防万一，但不会被需要，因为所有变量都被考虑到了，但我把它放在那里以防万一。我知道我可以使用很多类，但是我认为可能有更好的方法，因为使用许多具有相同CSS规则的类似乎过于冗余。我希望能有比半冗余CSS类更好的解决方案。 – Tek 2010-10-07 09:25:47

我编辑对不起。但是你可以在一个整数中存储许多布尔值= P我经常为我的元素使用许多类，但我试图避免冗余规则。 – MatTheCat 2010-10-07 09:27:34

读完你的例子之后，你所说的更有意义。嗯。我会试试这个。感谢您的建议，我会回来让你知道结果。 – Tek 2010-10-07 09:27:43

根据数据库结果在CSS中更改DIV颜色？

回答

相关问题