Могу ли я предотвратить перезапись стиля CSS?

Я хотел бы применить CSS к некоторым ссылкам на загрузку страницы, но один из них <a id="lb1">logoff</a> должен сохранять свой стиль, не зависание и другое событие не должны изменять его стиль.

В linkbuttons нет класса, а css, применяемый ко всем из них, выполняется с тегами, таким образом:

a
{
 //style
}

a:hover
{
  // style
}

Возможно ли это?

Ответ 1

Нет, вы не можете.

Вы можете использовать более конкретные селектор (или даже встроенный CSS с атрибутом стиля), чтобы они были менее вероятны, чтобы быть переопределенными случайно.

Вы можете использовать кувалду (eugh) !important, чтобы они были переопределены только другим правилом !important.

Невозможно предотвратить их переопределение.

Ответ 2

Пожалуйста, пожалуйста, пожалуйста, пожалуйста, избегайте использования !important, когда это возможно. Вы столкнетесь со многими неприятными проблемами и проблемами при использовании этого. Я считаю это очень ленивым взломом.

Что вы хотите сделать, это добавить класс к ссылке, которую вы не хотите перезаписывать. Классам присваивается более высокий приоритет, чем общие селекторы (такие a, p, b). Поэтому, если вы добавите этот класс в ссылку, CSS переопределит CSS по умолчанию, который вы установили для a.

CSS

a {
color: red;
}
a:hover {
color: blue;
}
.derp:hover { /*you can add everything you want to preserve here, essentially make it the same as the link css. you can also change it to #lbl:hover, although there no good reason to be using an ID as a CSS selector*/
color: red;
}

HTML:

<a href="#">this will turn blue on hover</a>

<a class="derp" href="#">this will stay red on hover</a>

Вот сценарий, чтобы показать вам. Вторая ссылка имеет добавленный класс, который сохраняет оригинальный стиль: http://jsfiddle.net/p6QWq/

Ответ 3

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

Затем вы можете позвонить:

  $(".myClass").css("backgound-color", "blue");
  • Это изменит цвет фона для каждого элемента с классом myClass на синий фон.

Или вы можете добавить целый новый класс к кнопкам ссылок, которые имеют класс myClass:

  $(".myClass").addClass("myExtraClass");
  • Затем будет создан атрибут class вашей кнопки ссылки class="myclass myExtraClass"

Ответ 4

Увидев ваш код, вы немного поняли, что вы хотите сделать. Попробуйте следующее:

a {
    text-decoration: none;
    color: orange;
}
a:hover {
    text-decoration: underline;
    color: blue;
}

Это применит стиль по умолчанию для всех элементов <a>. Теперь вы можете перезаписать этот стиль по умолчанию, указав определенный стиль для якоря с указанным выше идентификатором:

#lb1 {
    color: black;
    text-decoration: none;
}
#lb1:hover {
    color: black;
    text-decoration: none;
}

Я посмеялся над этим быстрым и грязным jsFiddle. Посмотрите, дает ли это желаемый результат. Идентификаторы имеют приоритет над классами и стилем элемента по умолчанию. Поэтому, если у вас есть тот, который вы хотите сохранить одинаково, примените и удостоверьтесь и соответствующим образом настройте конкретный элемент. Это также поможет вам, препятствуя вам применять класс к нескольким элементам. Это меньше кодирования для применения одного ID, чем для применения двенадцати классов. (Просто преувеличенный пример. Я не знаю, сколько ссылок у вас есть.)

Надеюсь, что это поможет.

Ответ 5

css каскадный по определению, поэтому любой стиль, который вы применяете к тегам, будет применяться к этому конкретному, за исключением случаев, когда вы перезаписываете его.

Вам придется либо назначить класс всем другим кнопкам, либо переписать все свойства по умолчанию для этой конкретной кнопки.

Кроме того, не забудьте псевдоклассы: visited и: active.

Ответ 6

Вы должны использовать !important в своем CSS, например:

a {
    /* style */
    background: #FFF !important;
}

a:hover {
    /* style */
    background: #FFF !important;
}

Ответ 7

Вы всегда можете перезаписать свой css, просто создав еще одну таблицу стилей и поместите ее в END ваших ссылок на стили в заголовке своего html.

<head>
    <link rel="stylesheet" href="location/location/first_stylesheet.css">
    <link rel="stylesheet" href="location/location/revised_stylesheet.css">
</head>

Это не самый эффективный метод перезаписи вашего css; можно было бы рекомендовать устранить необходимость в этой отдельной таблице стилей, просто добавив элементы с атрибутом класса. Класс attr позволит вам изменять основные элементы html, теги и накладывать последний слой, чтобы "управлять ими всеми". Наслаждайтесь!