Question

我正试图找到一种方法来使我的td或表格多色。

echo "<table  padding=\"0\" spacing=\"0\" 
  style=\"background-color:yellow; width: 100%; margin-left: 2px; 
  width: 100%; line-height: 80% ;\">";
echo "<tr>";
echo "<td class=\"bgfiller\">
  <font style=\"color: black;  font-size:90%; \" >
   ".$rowbis['Lnaam']." - ".$rowbis['Type_name']."</font>
  </td></tr>";

我的bgfiller风格如下：

.bgfiller{
  width: 10px;
  background-color: red;
  z-index: 1 ; 
}

所以我要做的是创建一个黄色的块，其中包含10px的小块（将在稍后的状态中由变量设置）并且在其上面有一些文本。

所以你会得到类似于带有文本的进度条。但是文本必须使用表格的完整宽度而只需要使用10px。

任何人都知道如何才能让它发挥作用？

Answer 1

首先，请删除<font>标记。如果您只需将font-size: 90%; color: black;添加到现有的.bgfiller规则中，就没有理由这样做。

但要回答你的问题，我建议这样的事情：

<div style="width: 200px; border: 1px solid black; position: relative;">
    Hello There I am Text
    <div style="width: 30px; background: yellow; position: absolute; left: 0; top: 0; z-index: -1;">&nbsp;</div>
</div>

请参阅：http://jsfiddle.net/knWuf/

Answer 2

这样的事情要清楚得多，但你究竟想用文字做什么？

演示：http://jsfiddle.net/WVvLD/

<div><span>Progress</span><div>

div {
    background-color: yellow;
}
span {
    background-color: red;
    display:block;
    width: 10px;
}

Answer 3

如果您想继续使用表格，这可能是一个解决方案：

<table width="100%">
 <tr>
        <td><span></span>this is an text</td>     
 </tr>
</table>

和风格

td{
background-color:green;
    width:100%;
    position:relative;
    z-index:-2;
}
td span{
    position:absolute;
    width:20px;
    height:20px;
    background-color:darkred;
    z-index:-1;
}

http://jsfiddle.net/WVvLD/34/

html / php中的多色TD？

3 个答案: