Что причины состоят в том, чтобы использовать идентификационный атрибут в целях CSS? [закрытый]

Выбор чего-либо с уникальным идентификатором выполняется быстрее, чем выбор с помощью класса. Разница незначительна, но в приложениях с огромным количеством элементов DOM или интенсивном приложении Javascript она имеет значение.

Например, если вы используете jQuery, проверьте следующее: правила производительности jquery

Нет, но если у вашего элемента есть id , почему бы не использовать его для стилизации?

То же самое можно сказать и об именах элементов - вы ничего не можете сделать с p , что нельзя было сделать с class = 'paragraph' . Это не означает, что добавлять class = 'paragraph' в каждый элемент

- хорошая идея.

Вам НЕ ОБЯЗАТЕЛЬНО использовать идентификаторы. Не существует дизайна, который можно было бы создать с использованием идентификаторов, которые нельзя создать с помощью классов.

С учетом сказанного, использование идентификатора имеет то преимущество, что четко помечает селектор как применимый только к одному элементу на странице. Я обычно использую их для стилизации элементов в своих шаблонах страниц (#Content, #Navigation и т. Д.).

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

Но, опять же, неважно, используете ли вы идентификаторы или нет.

IDs идентифицировать , классы классифицируют . Этот момент упоминался здесь несколько раз, более или менее.

Примером может быть:

<div class="author" id="stephen">[...]</div>

С точки зрения специфичности CSS, таргетинг ID сделает правила CSS более конкретными, чем правила с классами, даже с несколькими классами.

Таким образом:

p#recent {}

более конкретен, чем

body>p.news.recent {}

, и когда пользовательский агент находит оба из них, первое будет преобладать.

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

IMO, использование стилей на основе идентификаторов - плохая идея.

идентификаторы, будучи уникальными, должны встречаться только один раз в вашей DOM. Это ограничивает использование любого стиля, связанного с идентификатором, до 1 раза.

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

Честно говоря, я думаю, что идентификатор следует использовать для поведение и класс должны использоваться для стиля. Тот факт, что вы можете использовать их взаимозаменяемо, является частью того, что делает некоторые аспекты веб-разработки несовместимыми.

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

Основная причина, по которой я использую идентификаторы в CSS, - это макет. Если у меня один верхний и нижний колонтитулы, то:

#header
{
...
...
...
}

#footer
{
...
...
...
}

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

Using ID for styling makes sense if it's an element that doesn't have duplicate, especially if it's something that shows up in all/most pages.

E.g.:

• Page header & footer
• Search box (the thing you can see up there)
• Navigation list (something like the thing on the right)

Я склонен думать о взаимосвязи id и класса в HTML как об аналоге объектно-ориентированного программирования: id похож на экземпляр class .

Я использую классы чаще, чем идентификаторы, и часто использую мультиклассовые селекторы (например, .film.drama ). Но если я действительно хочу идентифицировать конкретный элемент, чтобы применить определенный стиль или поведение, то я назначу id , а часто и класс . Например,

<ul>
    <li class="film drama">A</li>
    <li class="book drama">B</li>
    <li class="film documentary" id="film-9832">C</li>
</ul>

При назначении идентификатора я думаю, что «может ли когда-нибудь иметь смысл, чтобы на странице было больше одного такого идентификатора». Если ответ положительный, то я бы, вероятно, выбрал класс.

В результате, как отметили @RichN и @AaronSieb, я часто использую id ' s для определенных элементов страницы, которые обязательно присутствуют на странице только один раз:

<ul class="sidebar" id="site-meta">[...]</ul>

Единственное, что я могу придумать для использования идентификатора, это если у вас есть война специфичности - два элемента с одинаковой специфичностью. Применение ID придаст вашему элементу более высокую специфичность - +100, если быть точным.

Таким образом, в случае, когда у вас есть два стиля, определенных с равной специфичностью, вы можете захотеть «заткнуть» один, применив более высокую специфичность к другому. При этом вы можете добиться того же, применив более конкретный класс к этому селектору, что увеличит специфичность на 10.

ID = 100 (#foo) class = 10 (.bar) element = 1 (div)

Лично я предпочитаю использовать идентификаторы для статических элементов страницы (верхние и нижние колонтитулы). Причина - вес страницы.

id = "h" светлее, чем class = "h".

На мой взгляд, на счету каждый байт.