c# - 如何将CSS添加到另一个对象的一部分？

我有一组跨页面的表，这些表始终称为tblData。我希望能够为表内的元素设置CSS属性，例如标签，列样式，文本等

此刻我正在这样做

#tblData{
style...}

.dataColumn{
style...}

但是我想以某种方式将它们合并到tblData类中，因此我只需要添加这一类即可完成布局。

这是我已经必须尝试设置文本框和标签样式的内容，但是label和textbox元素不起作用：

.tblData {
    border: solid;
    border-width: 1px;
    height: 200px;
    color: rgb(45,40,128);
    background-color: white;
    width: 100%;
    border-radius:3px;
    margin-top:3px;

}
/*Class for the labels*/
.tblData label {
    width: 13%;
    color:black;
    border-radius:3px;
    font-family:verdana;
    border-radius:3px;
    border-color:rgba(45,40,128,0.75);
    border-width:1px;

}
/*Class for the data textboxes*/
.tblData textbox {
    border-color: rgba(45,40,128,0.75);
    border-width: 1px;
    background-color:rgba(45,40,128,0.10);
    font-family:Verdana;
    border-radius:3px;
}

这是一个表格示例（注解不完整，因为它太大了）

  <table id="ContactsTable" class="tblData">
        <tr>
            <td class="auto-style1">
                <asp:Label ID="lblContact" runat="server" Text="Contact" CssClass="Datalabelcolumn"></asp:Label></td>
            <td>
                <asp:TextBox ID="TextBox1" runat="server" CssClass="Datatextbox" Width="200px"></asp:TextBox>
            </td>
            <td></td>
            <td></td>
            <td></td>

最佳答案

如果仅希望将一个类应用于表本身，则可以添加特定的CSS选择器以隔离表本身的某些元素，例如表的行或列，例如：

#tblData td{

/* sets cell styling */

}

#tblData tr{

/* sets row styling */

}

#tblData th{

/* sets head styling */

}

#tblData tr td:first-child{

/* sets styling of first column  */

}

#tblData tr td:last-child{

/* sets styling of last column  */

}

#tblData tr td:nth-child(n){

/* sets styling of specific column (change n to number)  */

}

上面的内容基本上是说，获取id为tblData的元素，然后选择适合以下选择器的子元素。还可能值得参考W3 selector documentation以获得更多信息。

这是带有一些示例选择器的FIDDLE。