如何选择div表的第一列?

时间:2014-05-15 10:11:32

标签: javascript jquery html css handsontable

我试图在我的div表粗体中创建第一列和第一行。 我设法使第一行变大胆。但我不能让第一栏显得大胆。

下面你可以看到我的html-css-javascript。如何使第一列显示粗体

                                                          

    <style type="text/css">
        body {background: white; margin: 20px;}
        h2 {margin: 20px 0;}
        .zebraStyle > tbody > tr:nth-child(2n+1) > td {background: #e0e0d1;}
        .firstRowStyle > tbody > tr:nth-child(1) > td {font-weight: Bold;}
        .firstColumnStyle > tbody > tr:eq(1) {font-weight: Bold;}
    </style>

    <script type='text/javascript'>
        var arr= [["", "2012", "2013", "2014(YTD)"],["Ferrari", 1460089088.3900001, 1637243070.99, 283566771.55000001],["Alfa Romeo", 1199141138.1900001, 1224624821.1500001, 192307335.49000001]];

        $(document).ready( function(){
            $('#myTable').handsontable({
                data: arr,
                minSpareRows: 1,
                contextMenu: true,
                readOnly: true,
                fixedColumnsLeft: 1
            });
            $('#myTable').find('table').addClass('zebraStyle');
            $('#myTable').find('table').addClass('firstRowStyle');
            $('#myTable').find('table').addClass('firstColumnStyle');

        });
    </script>
</head>
<body>
    <div id="myTable" class="handsontable" style="width: 400px; margin-left:auto; margin-right:auto; background-color:silver"></div>
</body>

2 个答案:

答案 0 :(得分:4)

使用下面的css

#myTable tr td:first-child{
font-weight:bold;
}

这将首先选择td

答案 1 :(得分:1)

使用jQuery:

$("#myTable").find("td:first-child").css("font-weight", "bold");

或者使用css类:

.firstColumnStyle {font-weight: Bold;}

使用jquery添加类:

$("#myTable").find("td:first-child").addClass("firstColumnStyle");

注意:在IE7中仅使用CSS:第一个子伪选择器不适用于动态元素。 Source