X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

3 страниц V   1 2 3 >
Открыть тему
Тема закрыта
> ID - для JS, а class - для html?
hedin.83
hedin.83
Topic Starter сообщение 23.11.2013, 2:58; Ответить: hedin.83
Сообщение #1


Доброго времени суток форумчане! Перелопатил кучу комментариев на разных форумах, но к определенному ответу так и не пришел. Подскажите пожалуйста, действительно ли стоит использовать ID для js, а class для стилей. Т.е. прописывать через ID стили не стоит т.к. не для этого он задумывался?
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Degradator
Degradator
сообщение 23.11.2013, 12:10; Ответить: Degradator
Сообщение #2


Я считаю что ид надо совать везде где это удобно.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Den1xxx
Den1xxx
сообщение 23.11.2013, 12:55; Ответить: Den1xxx
Сообщение #3


(hedin.83 @ 23.11.2013, 05:58) *
Подскажите пожалуйста, действительно ли стоит использовать ID для js, а class для стилей. Т.е. прописывать через ID стили не стоит т.к. не для этого он задумывался?

ID используется если нужно однозначно задать один объект. Потому что ID на странице может быть только 1.
Class используется там где нужно многократное повторения стиля.
Примеры.
1. ID я использую при обозначении блоков:
Заголовок id=header, левая панель id=left_sidebar, правая панель id=right_sidebar, главный блок id=main, подвал страницы id=footer.
2. Классы используются при оформлении:
Заголовок при выводе блока информации — class=window-title, блок информации — class=window-main
Блоки информации — точки вывода разных модулей, выводятся на странице многократно, поэтому применяется класс.
3. Если нужно скажем чтобы левый сайдбар имел немного другую стилизацию чем весь остальной сайт, используем сочетание id+class:
[CSS]#left_sidebar .window-title{
font: 26px;
}
#left_sidebar .window-main{
padding: 5px 10px 20px 7px;
}[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
hedin.83
hedin.83
Topic Starter сообщение 23.11.2013, 18:15; Ответить: hedin.83
Сообщение #4


Спасибо за ответы!!! Но все же сомневаюсь, что стоит ID тыкать где попало, все же это более так сказать "уникальный" инструмент верстки, и главная его цель - это быть якорем и служить для выделения и дальнейшего нахождения (простите за товталогию) объектов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Degradator
Degradator
сообщение 23.11.2013, 18:19; Ответить: Degradator
Сообщение #5


Где попало его тыкать не надо. Например
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id = "wrapper">
<div id = "header"></div>
<div class = "left sidebar"></div>
<div class = "right sidebar"></div>
<div id = "content"></div>
<div id = "footer"></div>
</div>
</body>
</html>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Den1xxx
Den1xxx
сообщение 23.11.2013, 20:58; Ответить: Den1xxx
Сообщение #6


Degradator, только оба сайдбара должны идти после контента.
Именно в этом и есть преимущество блочной верстки.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
hedin.83
hedin.83
Topic Starter сообщение 24.11.2013, 2:22; Ответить: hedin.83
Сообщение #7


А почему именно основные блоки через ID, а не все, и почему они не через class? НА основании чего такой выбор? Потому, что они "основные"?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Alcorn
Alcorn
сообщение 24.11.2013, 6:43; Ответить: Alcorn
Сообщение #8


id не вижу смысла применять для стилизации элементов, используется максимум для якоря, ибо сегодня один элемент, завтра - два. Не использую id и минусов не заметил.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Den1xxx
Den1xxx
сообщение 24.11.2013, 13:38; Ответить: Den1xxx
Сообщение #9


(hedin.83 @ 24.11.2013, 05:22) *
А почему именно основные блоки через ID

Потому что основные блоки в дизайне применяются однажды. Если нужно сделать 2 одинаковых блока, используйте класс.
(Alcorn @ 24.11.2013, 09:43) *
id не вижу смысла применять для стилизации элементов

ИД имеет больший вес чем класс. Такое разделение позволяет получать 100% ожидаемое поведение дизайна.

Кроме того я вешаю ИД ещё на навигацию — чтобы выделить текущую ссылку, обработка яваскриптом меню по ИД работает гораздо быстрее чем по классу.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Alcorn
Alcorn
сообщение 24.11.2013, 14:37; Ответить: Alcorn
Сообщение #10


(Den1xxx @ 24.11.2013, 16:38) *
ИД имеет больший вес чем класс. Такое разделение позволяет получать 100% ожидаемое поведение дизайна.


Для переопределения свойств добавляю к классу модификатор (mod), как раз даёт больший вес -

[CSS]
.className {

}
.className.mod {
// тут переопределение
}
[/CSS]


(Den1xxx @ 24.11.2013, 16:38) *
Кроме того я вешаю ИД ещё на навигацию — чтобы выделить текущую ссылку, обработка яваскриптом меню по ИД работает гораздо быстрее чем по классу.


Ну отработает быстрее на одну наносекунду, если это нормальная страница (а не миллионы dom-элементов), экономия сомнительна.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
3 страниц V   1 2 3 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) ✅ sms.chekons.com - ⭐ Сервис для получения SMS на реальные номера USA "Non-VoIP, безлим SMS, API" ⭐
Сервис для получения SMS на реальные номера USA
13 Chekon 4045 Сегодня, 11:48
автор: Chekon
Открытая тема (нет новых ответов) Rebex.io – Ваша инновационная платформа для обмена криптовалюты!
1 Rebex 663 Вчера, 11:50
автор: Rebex
Открытая тема (нет новых ответов) Какой % отказов нормален для сайта?
11 Aloof 2801 16.4.2024, 12:48
автор: diviner99
Горячая тема (нет новых ответов) Betatransfer.net - прием платежей для HIGH RISK проектов, интернет эквайринг и мерчант онлайн оплат
54 arendator 34817 15.4.2024, 15:16
автор: arendator
Горячая тема (нет новых ответов) ⭕Антидетект браузер AdsPower для эффективной работы с мультиаккаунтами!
83 AdsPower 24409 14.4.2024, 22:52
автор: AdsPower


 



RSS Текстовая версия Сейчас: 18.4.2024, 18:56
Дизайн