CSS ID против класса

Question

В чем принципиальная разница между CSS ID и CSS Class?

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

как

body
{
        background-color: #3399FF;
}

div#menuPane{
    position: absolute;
    left: 25px;
    top: 25px;
    width: 25%;
}

div.menu {
    display: block;
    font-size: 14px;
    margin: 0;
    padding: 0;
    border: 2px solid #7FC07F;
}

div.menu a {
    display: block;
    font-weight: bold;
    text-decoration: none;
    text-align: right;
    letter-spacing: 1px;
    margin: 0px;
    color: black;
    border-top: 1px solid #487048;
}

div.menu a:link{
    background: #33CCFF;
}

div.menu a:visited{
    background: #33CCFF;
}
div.menu a:hover{
    background: #3FC73F;
    letter-spacing: 2px;
}

div.menu h4{ 
    padding: 2px;
    margin: 0px;
}

div#content{
    position: absolute;
    left: 30%;
    top: 25px;
    width: auto;
    border: 2px double #7FC07F;
    background-color: #33CCFF;
    padding: 2px;
    margin-right: 5px;
}

div#content h3{
    background-color: #A3F4A3;
    text-align: right;
    letter-spacing: -1px;
    color: #386938;

    border-bottom: 1px solid black;
}

div#content a:link, a:visited{
    background:#0099FF;
    color: #A3F4A3;
    letter-spacing: 1px;
}

div#content a:hover{
    background: #FF0000;
    color: #A3F4A3;
    letter-spacing: 1px;
}   

Answer 1

Думайте об идентификаторе как о студенческом. Только одна существует в вашей школе - ваша. Думайте о классе как о группе детей ... все они принадлежат к одному классу: "Биология". Если вы хотите обратиться к конкретному студенту, вы должны сделать это, подтвердив его / ее удостоверение личности - поскольку это никогда не будет адресовано более чем одному студенту. Если вы хотите обратиться к группе студентов, вы можете сделать это, признав их класс - «Урок биологии будет наслаждаться пиццей сегодня» против «Джонатан Сэмпсон будет наслаждаться пиццей сегодня».

<students>
  <student id="jonathan-sampson" class="biology" />
  <student id="lizza-matthews"   class="earth-science" />
  <student id="michelle-andrews" class="biology" />
</students>

Вынос:

• ID = ID студента (школы не выдают идентичные идентификаторы нескольким студентам)
• CLASS = Группа студентов (например, «Урок биологии» будет проходить экскурсию)

Answer 2

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

Answer 3

См. этот ответ для описания различий.

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

Классы используются там, где стиль повторяется, например скажем, вы возглавляете специальный Форма заголовка для сообщений об ошибках, вы может создать стиль h1.error {}, который будет применяться только к

Answer 4

Последнее замечание - некоторые браузеры допускают несколько идентичных значений «id», но вам определенно не следует этого делать, так как это будет нарушать браузеры, соответствующие стандартам.

Answer 5

.class повлияет на соответствие элементов значению в атрибуте "class". Стиль по идентификатору повлияет на соответствие элементов значению в атрибуте "id".

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