使用CSS，如何设置单个单元格或单个列的格式？

问题描述：

使用CSS，如何设置单个单元格或单个列的格式？使用CSS，如何设置单个单元格或单个列的格式？

答

给单元格一个类名称和风格的类。

<td class="cellClass">test</td> 

.cellClass { color: #a9a9a9 }

CSS标准定义了一个叫做** first-child **的伪类，它可以在不专门使用自定义css类的情况下解决问题，但没有浏览器支持它...... – awe 2009-08-19 13:03:44

该CSS声明将应用于多个元素。 – random 2009-08-19 13:04:19

在提到的问题中，“只是一个单元格”而不是“第一个单元格”。 – rahul 2009-08-19 13:05:27

答

给电池/列一类或ID和使用CSS格式应用到

答

表格单元格，你需要给它某种标识，这样你可以参考它。根据您的需求，这将是一个类或一个ID。

<td class="specialCell">...</td>

在你的CSS你就可以将不同格式：

.specialCell { color: red; }

如果您希望将不同样式应用到一列，还有就是<col>标签，但浏览器的支持是有限的。你可能会更好的那类适用于手动的所有元素（或使用Javascript）

答

使用ID选择刚刚页面中的一个元素目标，在这种情况下，一个表格单元格：

<tr> 
    <td id="foo"></td> 
</tr>

然后在CSS：

#foo 
{ 
//-- CSS styling goes here just for this element only 
}

即散列符号（#）标志着名称选择为属于id。您可以进一步锁定它的样式表只与ID应用于TD手机，像这样：

td#foo 
{ 
//-- CSS styling goes here just for this element only 
}

如果您在rowspan属性添加到TD，你就可以把它转换成一个列并保留你可能已经设定的样式。

<td id="foo" rowspan="3"></td>

如果标记与前一期的CSS选择器的名称，像这样（。）：

.foo 
{ 
    //-- CSS styles 
}

，将目标class选择在HTML中，你可以风格，如果超过一个匹配的元素在应用CSS类属性的标签，就像这样：

<tr> 
    <td class="foo"></td> 
    <td class="foo"></td> 
    <td class="foo"></td> 
</tr>

不要使用CLASS，除非它会出现不止一次在页面上更多。

像ASP.NET这样的框架改变了应用于元素的ID。我确信其他人也这样做。如果您打算推荐使用ID，最好注意这一点。 – krdluzni 2009-08-19 13:04:54

仅基于HTML/CSS编写的答案似乎没有提及任何其他框架的使用。 – random 2009-08-19 13:06:30

@krdluzni：该示例为div标签指定id，这是一个html标签。 ASP.NET永远不会改变html标签的id，但.NET标签的ID（例如：** asp：Button **）可能会在生成的html标签上产生不同的id。 – awe 2009-08-19 13:14:58

答

查看HTML和<colgroup>标签，它们允许您一次对整列或相邻列组应用格式。

答

您可以风格应用COLGROUP：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
     <style type="text/css"> 
      #special { background:yellow } 
     </style> 
    </head> 
    <body> 
     <table> 
      <colgroup></colgroup> 
      <colgroup id="special"></colgroup> 
      <tr> 
       <td>a</td> 
       <td>1</td> 
      </tr> 
      <tr> 
       <td>b</td> 
       <td>2</td> 
      </tr> 
     </table> 
    </body> 
</html>

答

可以分配两个名称的列。 ex

<div class="foo"></div> 
<div class="foo bar"></div> 
<div class="foo"></div> 

div.foo { color: #fff; } 
div.bar { background-color: green; }

也许这可以解决您的问题？

使用CSS，如何设置单个单元格或单个列的格式？

相关推荐