Каскадные таблицы стилей используют "id" или "class",

при стилизации определенных элементов html я всегда использую атрибут класса. код css выглядит чище imo.

почему существуют оба существа, которые вы должны использовать и когда?

Ответ 1

id s id. класс es класс элементы ify.

Поместите класс в элемент, если "он как бы..." (например, адрес)

Поместите идентификатор элемента, если "это..." (например, навигация)

Ответ 2

В этом порядке предпочтительнее:

ID (должен быть только один на странице);
Элемент и класс (например, div.myclass); затем
Класс без классификатора элементов.

Идентификатор является самым быстрым поиском. Следующим самым быстрым является поиск по тэгу. Slowest - по имени класса.

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

Ответ 3

Я использую id, если это один элемент, класс, если он применяется к нескольким

Ответ 4

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

<div id="mainForm">
<div id="wrapper">

Класс может определять стили для нескольких элементов. Я использую его для определения способа отображения определенного типа элемента на странице.

<p class="comments">
<div class="smallText">

Ответ 5

Существует много способов выбора стиля. Вы можете использовать id, классы и теги, и вы можете их комбинировать:

#nav - применяется к элементу с id = "nav"

#nav div - применяется к любому элементу div внутри элемента с id = "nav"

#nav .left - применяется к любому элементу с class= "слева" внутри элемента с id = "nav"

.item span - применяется к любому элементу span внутри элемента с class= "item"

.item .address - применяется к любому элементу с class= "адресом" внутри элемента с class= "item"

div.item - применяется к любому элементу div с элементом class= "

#nav div span - применяется к любому элементу span внутри элемента div внутри элемента с id = "nav"

Важно для селекторов css, насколько они конкретны. Идентификатор более специфичен, чем класс. С помощью этого стиля:

.dark { color: black; }
#bright { color: white; }

Этот элемент получит белый текст, поскольку стиль с использованием идентификатора более специфичен, чем стиль с использованием класса:

<div id="bright" class="dark">Hello world</div>

Существует еще больше сведений о селекторах и специфике. Я нашел этот урок хорошим обзором селекторов: Selectutorial

Ответ 6

Идентификаторы

#header
#footer
#sidebar
#menu
#content

Классы

.important
.warning
.validationError
.recent
.outOfDate
.inactive
.weekDay
.previous
.next
.first
.last

Ответ 7

Что касается HTML, то id идентифицирует один элемент в DOM, и каждый элемент может иметь только один уникальный идентификатор, тогда как класс классифицирует один или несколько элементы в DOM, и каждый элемент может иметь несколько классов.

<div id="this-unique-element" class="class1 class2 class3">...</div>

Кроме того, с точки зрения CSS, помните, что порядок важности имеет наименее конкретный характер. Таким образом, свойства #id переопределяют свойства .class, которые, в свою очередь, переопределяют свойства tag. Поэтому стили #id стилей trump .class, если только определенные свойства класса не помечены !important.

<style>
    #red1, #red2 { color: red; }
    .blue1 { color: blue; }
    .blue2 { color: blue !important; }
</style>

<p id="red1" class="blue1">This text is red.</p>
<p id="red2" class="blue2">This text is blue.</p>

Ответ 8

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

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

Ответ 9

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

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

Например:

<div id="header" />

У вас есть только один заголовок для данного документа.

<div class="item alternate last" />

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

Etc.

Ответ 10

Идентификатор должен быть уникальным в документе. КЛАСС может применяться (и комбинироваться) к нескольким элементам на одной странице.

Идентификатор

не может быть объединен (mutiple id). Это работает:

<div class="beautiful blonde stupid"> blah blah blah </div>

но это не работает:

<div id="Paris Hilton"> blah blah blah </div>

Динамический HTML обычно использует id для управления элементами. Элементы с идентификатором имеют самый быстрый "поиск", как упоминает cletus, когда javascript каким-то образом используется, чтобы страница взаимодействовала с пользователем.

Подумайте о классе и идентификаторе в этих контекстах, и причины для каждого станут ясными.

Представьте себе страницу с несколькими функциональными div. Каждый div имел бы тот же класс, чтобы отображать общий стиль (т.е. Ширину). И каждый div нуждается в уникальном идентификаторе, чтобы стилизовать его, когда он был выбран. В этой ситуации у вас может быть что-то вроде этого:

<div class="demo" id="div1" onlick="action()"> blah blah blah </div>

и javascript-процедура где-то вроде:

function action() 
{
  document.getElementById( 'div1' ).style.backgroundColor = 'red'
}

Примечание. Это немой код, но он должен получить точку в

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

Итак, общее правило - если оно уникально, используйте id, если он не использует класс. Очень легко изменить id на класс, если это необходимо. Не так легко переключиться назад.

Ответ 11

Для целей CSS я разделяю вашу привычку использовать только class. Когда JavaScript нужно прикоснуться к элементам, я также дам их id, но я не стилю в id из моих таблиц стилей.

Мои причины для этого просты: всегда возможно, что где-то по дороге вам может понадобиться еще одна. Если вы нарисуете его на class, вы можете просто добавить второй элемент с этим class, и вам будет хорошо идти. Если вы нарисуете его на id, вам нужно либо изменить id на class, либо (если есть какой-либо код, ссылающийся на id), разделите id на id и a class, а затем выяснить, как разделить атрибуты и ссылки между ними. Намного проще просто стилизовать его с помощью class для начала.

Я также предпочитаю class es, потому что вы можете назначить несколько элементов одному элементу, что помогает избежать бессмысленного повторения в таблице стилей, хотя это слабый аргумент, учитывая, что нет причин, по которым вы не можете сделать какой-то стиль на id и другом стиле, основанном на произвольном числе class es.

Ответ 12

Прочитайте описание id и class в Спецификация HTML 4.01.

Ответ 13

Где использовать идентификатор по сравнению с классом

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

Идентификаторы - невероятно мощный инструмент. Элемент с идентификатором может быть объектом фрагмента JavaScript, который каким-то образом манипулирует элементом или его содержимым. Атрибут ID может использоваться как цель внутренней ссылки, заменяя метки привязки атрибутами имени. Наконец, если вы сделаете свои идентификаторы понятными и логичными, они могут служить своего рода "самостоятельной документацией" в документе. Например, вам необязательно добавлять комментарий перед блоком, заявляя, что блок кода будет содержать основной контент, если в открывающемся теге блока есть идентификатор, скажем, "главный", "заголовок", "нижний колонтитул" "и т.д.

Ответ 14

Если вам нужен простой ответ:

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

CLASS: вы можете назначить его нескольким группам элементов, и вы можете легко изменить их стиль сразу.
ID: если вы хотите вызвать один конкретный элемент, вы должны использовать идентификатор, но обратите внимание, что он ДОЛЖЕН быть уникальным

Ответ 15

Идентификатор означает идентификатор, он указывает только один тег. Он может использоваться один раз на странице.

Класс может использоваться несколько раз. Он может использоваться более одного раза на одной странице.