Как переопределить свойство css?

Я попытался использовать jquery, но не смог переопределить свойство width .gridHeader класса.

Я хотел бы исправить (скажем, 100px) ширину первого столбца в таблице.

<html>
    <head>
        <style>
            html, body {
                font-family:Tahoma;
                font-size:11px;
            }
            .grid {
                border-left:1px solid #CCCCCC;
                border-top:1px solid #CCCCCC;
            }
            .gridHeader {
                background-color:#EFEFEF;
                border-bottom:1px solid #CCCCCC;
                font-weight:bold;
                height:20px;
                padding-left:3px;
                text-align:left;
                width:100%; /* problematic, that I cannot change*/
            }
            table.grid > tbody > tr > td {
                border-bottom:1px solid #CCCCCC;
                border-right:1px solid #CCCCCC;
                padding:3px;
            }
        </style>
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                $(".gridHeader").css("width","");
            });
        </script>
    </head>
<body>
    <table width="100%">
        <tr>
            <td class="gridHeader" style="width:100px">Vikas
            </td>
            <td class="gridHeader">Vikas Patel Vikas Patel Vikas Patel
            </td>
            <td class="gridHeader">Vikas Patel Vikas Patel
            </td>
        </tr>
        <tr>
            <td>Vikas
            </td>
            <td>Vikas Patel Vikas Patel Vikas Patel
            </td>
            <td>Vikas Patel Vikas Patel
            </td>
        </tr>
    </table>
</body>
</html>
7
css html jquery properties

4 ответов

вам нужно удалить встроенный стиль с помощью removeAttr а затем используйте css() способ такой:

$(".gridHeader").removeAttr('style').css("width","100px");

если вы хотите применить ширину первого столбца, вы можете использовать :first селектор фильтра такой:

$(".gridHeader:first").removeAttr('style').css("width","100px");
12

Я думаю, ваша проблема не в первом столбце, а в других, пока они все еще применяются на 100%.

$(".gridHeader").css("width","");

...не будет работать, потому что вы не установили юридическую ценность.

попробуйте это:

$(".gridHeader").not(':first-child').css("width","auto");
2

отлично работает для меня? Если только я не понимаю твою "проблему".

проверка:http://www.jsfiddle.net/YjC6y/21/

0

Если вы хотите переопределить CSS inline, вам может повезти сделать это так:

style="width:100px !important;"
0