добавить класс к элементу li или a?

Question

У меня стандартный список ссылок:

<li><a href="">one</a></li>
<li><a href="">two</a></li>

Если я хочу добавить дополнительный класс к одному из элементов списка, я должен добавить класс к элементу li или a ? Что такое лучшая практика?

Большое спасибо!

Cameron

Answer 1

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

Там действительно нет одного правильного ответа. Вы должны стиль, который имеет смысл семантически. Во многих случаях вам может понадобиться стилизовать как элемент списка , так и привязку, и в этом случае вы должны добавить класс в тег li и определить ваши стили для обоих.

li.myclass {
    /* li styles */
}

li.myclass a {
    /* link styles */
}

Это почти то, что предложил alex . Второй стиль предназначен только для тех ссылок, которые заключены в элементы списка вашего класса.

Answer 2

Как правило, я бы добавил его к элементу списка. Это дает вам гибкость, чтобы нацелить с помощью CSS элемент списка или тег привязки, который он содержит

li.class-name {
    /* target li class */

}

li.class-name a {
    /*target it's anchor */
}

Тем не менее, в производственной среде вам лучше оставить начальный li вне имени класса при обращении к нему. Это не нужно (если у вас действительно плохая память).

Answer 3

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

Answer 4

Если вы хотите просто назначить стиль одной из ссылок в вашем списке, используйте вместо класса идентификатор. Вот так.

<li id="new_style"><a href="">one</a></li>

И стиль это так:

#new_style { margin: 1em; font-weight: 600; }