求一CSS,控制table,td.

做了2个示例表,实际情况的数据太多了.CSDN贴不出.
实际情况下有多个表. 想用css来控制.

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

.ccc { width:100px; background-color:#cccccc; text-align:right; }<td class="ccc"></td>
<HTML>
    <HEAD>
        <title>PtInfo</title>
        <META http-equiv="Content-Type" content="text/html; charset=gb2312">
        <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
        <meta content="C#" name="CODE_LANGUAGE">
        <meta content="JavaScript" name="vs_defaultClientScript">
        <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<style>
.whiterow{
background-color:#cccccc;
width:100px;
text-align:right;
}

.grayrow{
background-color:#FFFFFF;
width:150px;
text-align:center;
}
</style>
    </HEAD>
    <body MS_POSITIONING="GridLayout">
        <form id="Form1" method="post" runat="server">
            <TABLE id="Table1" cellSpacing="1" cellPadding="1" border="1">
                <TR>
                    <TD class="grayrow">年龄</TD>
                    <TD class="whiterow">
                        <asp:Label id="Label1" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
                <TR>
                    <TD class="grayrow">身高</TD>
                    <TD class="whiterow">
                        <asp:Label id="Label2" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
                <TR>
                    <TD class="grayrow">地址</TD>
                    <TD class="whiterow">
                        <asp:Label id="Label3" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
            </TABLE>
            <TABLE id="Table2" cellSpacing="1" cellPadding="1" border="1">
                <TR>
                    <TD class="grayrow">学历</TD>
                    <TD class="whiterow">
                   <asp:Label id="Label4" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
                <TR>
                    <TD class="grayrow">家产</TD>
                    <TD class="whiterow">
                        <asp:Label id="Label5" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
                <TR>
                    <TD class="grayrow">长相</TD>
                    <TD class="whiterow">
                        <asp:Label id="Label6" runat="server">Label</asp:Label></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                    <TD class="grayrow"></TD>
                    <TD class="whiterow"></TD>
                </TR>
            </TABLE>
            </TD>
</form>
    </body>
</HTML>
正如楼上两位说的那样.xxx{
background-color: 设置颜色 ;
width: 设置大小 ;
}<td class = "xxx"></td>
就是css了同意楼上你也可以把css封装起来
用class最简单了,也可以用js来做,通过js获取所有的TD对象,然后根据他们的颜色,增加宽度属性~
FireFox支持属性选择器:(IE不支持)
先定义所有TD的属性
TD
{
width:YYY;
}
对特定颜色的TD进行特别定义:(IE不支持)
(非IE浏览器)
TD[bgColor="#ccc"]
{
width:xxx;
}
(IE浏览器)
TD
{
width:expression((this.bgColor=="#ccc"?"YYY":"XXX")
}将上面的都写入CSS中,修改XXX,YYY为需要数据即可~
width:expression((this.bgColor== "#ccc ")? "YYY ": "XXX ") 不好意思,上面的漏掉了一个")"