Загрузка...
Id в HTML
После class id именует один элемент.
Почему важны уникальные имена
Переходы ждут одно совпадение.
Прямой ответ
id="faq" один раз. href="#faq". CSS #faq. Не id="#faq". Для общего стиля — class.
📊 id versus class
| Feature | id | class |
|---|---|---|
| Uniqueness | One per page (ideally) | Many elements may share |
| HTML attribute | id="faq" (no #) | class="tip" (no .) |
| CSS selector | #faq | .tip |
| Common uses | Bookmarks, unique hooks, script targets | Reusable styles and groups |
Fragment-ссылка к уникальному заголовку
Ссылка сверху, id снизу.
Unique id and fragment link
html
HTML Code
<p><a href="#faq">Jump to FAQ</a></p>
<h2 id="faq">FAQ</h2>
<p>Answers go here.</p>Разбор fragment
-
только в ссылке
- голое имя в атрибуте
Уникальный CSS-крючок с #id
Одна панель — умеренно.
Unique id with CSS
html
HTML Code
<div id="promo">
<h2>Limited offer</h2>
<p>One panel, one unique hook.</p>
</div>
<style>
#promo { border: 2px solid #0a7; padding: 12px; }
</style>Разбор уникального стиля
-
promo в CSS
- без # в атрибуте
Выбор id или class
Несколько элементов? class. Одна цель? id.
Практика
- заголовок с id
- ссылка # и переход
- убрать дубли
- class для tip
Частые ошибки
- дубли id
-
в атрибуте
- id для каждого общего стиля
Кратко
- id уникален
-
в href/CSS
- class для общего
🧠 Проверьте Свои Знания
Готов к Началу
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
6
Вопросы
70%
Для Прохождения
∞
Время
∞
Попытки
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху