CSS тот же стиль для A: link a: посетил a: hover a: active, действительно нужно записать все это 4 раза

хо-хо,

при работе с CSS. Если стиль CSS одинаковый для A:link a:visited a:hover a: active, действительно нужно записать его на время. Работа с пользовательской ссылкой.

.DT_compare a:link {
    font-family:"Lucida Grande", Arial, sans-serif;
    font-size:11px;
    line-height:14px;
    font-weight:normal;
    font-style:normal;
    color:#EEE;
    text-align:center;
}

какие-то ярлыки?

дивное

6 ответов


просто забудьте псевдоклассы и выберите только a:

.DT_compare a {
    font-family:"Lucida Grande", Arial, sans-serif;
    font-size:11px;
    line-height:14px;
    font-weight:normal;
    font-style:normal;
    color:#EEE;
    text-align:center;
}

это не очень конкретный селектор, хотя; при необходимости вы можете найти другой способ увеличить его, чтобы он переопределяет ваш a:hover и a:active селекторы, или идти с whoughton это вместо этого и просто укажите все четыре из них.

опять же, если ваши основные стили гиперссылок применяются к a:hover и a:active ничего перед ними, пока вы размещаете свой .DT_compare a правило под ними должно работать нормально.


Я не думаю, что вы можете делать любые короче:

.DT_compare a:link,
.DT_compare a:visited,
.DT_compare a:hover,
.DT_compare a:active, {
    font-family:"Lucida Grande", Arial, sans-serif;font-size:11px;line-height:14px;font-weight:normal;font-style:normal;color:#EEE;text-align:center; }

оставить :link off, чтобы повлиять на все государства сразу.


меньше может помочь здесь через "mixins", например:

.a {
  text-decoration: none;
  color: black;
}

a:link { .a; }
a:visited { .a; }

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


.DT_compare a[href]{ ... }

приятно, потому что вы можете проникнуть в некоторую дополнительную специфику. (однако селектор атрибутов = = селектор классов).


.DT_compare a:link, a:visited {
font-family:"Lucida Grande", Arial, sans-serif;
font-size:11px;
line-height:14px;
font-weight:normal;
font-style:normal;
color:#EEE;
text-align:center;
}

.DT_compare a:hover, a:active {
font-family:"Lucida Grande", Arial, sans-serif;
font-size:11px;
line-height:14px;
font-weight:normal;
font-style:normal;
color:#EEE;
text-align:center;
}