Как переопределить свойство css? - PullRequest
Новая
       1

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

7 голосов
/ 14 октября 2010

Я пытался использовать 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>

Ответы [ 4 ]

12 голосов
/ 14 октября 2010

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

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

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

$(".gridHeader:first").removeAttr('style').css("width","100px");
2 голосов
/ 14 октября 2010

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

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

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

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

$(".gridHeader").not(':first-child').css("width","auto");
0 голосов
/ 14 октября 2010

Если вы хотите переопределить встроенный CSS, возможно, вам повезет, если вы сделаете это следующим образом:

0 голосов
/ 14 октября 2010

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

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...