如何在选择框中显示不同颜色的不同颜色

时间:2012-12-05 04:22:35

标签: html css

我有一部分代码显示一个Multi Select框,并根据if语句显示选项:

$moduleSELECT = '<select name="moduletextarea" id="moduleselect" size="10">'.PHP_EOL;      

if($modulenum == 0){

$moduleSELECT .= "<option disabled='disabled' value=''>No Modules currently on this Course</option>";   


}else{   

while ( $currentmodstmt->fetch() ) {

$moduleSELECT .= sprintf("<option disabled='disabled' value='%s'>%s - %s</option>", $dbModuleId, $dbModuleNo, $dbModuleName) . PHP_EOL; 
}

}

$moduleSELECT .= '</select>';

现在从互联网上做一些研究我认为在选项标签中包含标签是不好的做法。所以我的问题是如果if语句为真,其中0的记录数,如何以红色显示"<option disabled='disabled' value=''>No Modules currently on this Course</option>";的文本,如果满足else语句,我如何显示这些选项{{1}在黑色文字中?

由于

2 个答案:

答案 0 :(得分:2)

只需将css样式设置为select(如果没有选项),在这种情况下color: red; 你也可以选择不同的颜色,只需在每个选项上设置不同的颜色。例如:http://jsfiddle.net/kennypu/CP8Xf/1/

答案 1 :(得分:1)

我不相信您可以使用CSS设置单个<option>标记的样式,但您可以将整个<select>设置为@kennypu指出的样式。

使用更好/更直观的UI实现所需结果的另一种方法可能是在实际放入数据时仅输出<select>标记。当$modulenum == 0时,您可能只需要输出一些可以正确设置样式的HTML。

HTML

<div class='no-data'>No Modules currently on this Course</div>

CSS

.no-data{
  background-color: #CCC;
  color: red;
  padding: 5px;
}