эти названия классов CSS хороши? - PullRequest
3 голосов
/ 11 апреля 2010

См. Раздел /* Common Classes */ этой страницы.

http://webdesign.about.com/od/css/a/master_stylesht_2.htm

эти классы CSS хороши для использования в любом проекте? с точки зрения семантики?

/* Common Classes */

.clear { clear: both; }

.floatLeft { float: left; }

.floatRight { float: right; }

.textLeft { text-align: left; }

.textRight { text-align: right; }

.textCenter { text-align: center; }

.textJustify { text-align: justify; }

.blockCenter { display: block; margin-left: auto; margin-right: auto; } /* remember to set width */

.bold { font-weight: bold; }

.italic { font-style: italic; }

.underline { text-decoration: underline; }

.noindent { margin-left: 0; padding-left: 0; }

.nomargin { margin: 0; }

.nopadding { padding: 0; }

.nobullet { list-style: none; list-style-image: none; }

Ответы [ 5 ]

14 голосов
/ 11 апреля 2010

Нет. Они не являются хорошим выбором. Весь смысл CSS и, в частности, концепции класса заключается в том, чтобы описать «что» представляет собой нечто, а не «как» это должно выглядеть. Что что-то значит (то есть его семантика) и как оно выглядит (то есть его представление) - это два отдельных понятия. Факт, что что-то, скажем, меню, не изменится, если вы решите показать его синим на голубом с одной таблицей стилей и высококонтрастным черным на белом на другой таблице стилей, созданной для дальтоников.

Если вы придаете классу смысл презентации, изменение внешнего вида документа потребует внесения изменений в html веб-страницы, исключая весь смысл использования CSS как технологии, специально разработанной для предоставления и инкапсуляции презентации. Чтобы предотвратить это, альтернативой было бы иметь классы, имена которых не представляют разумную информацию (например, класс с именем bluefont, который фактически содержит директиву color: red). Следовательно, наличие «bluefont» в качестве имени является абсолютно произвольным, и здесь происходит десинхронизация с фактическим содержимым. Это могла быть случайная строка «abgewdgbcv», но тогда лучше выбрать что-то, что не связано с представлением и передает смысл: связанную с ним семантику.

И мы закрываем круг: это весь смысл занятий. См. Также этот документ на W3 .

13 голосов
/ 11 апреля 2010

Нет, не совсем.

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

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

1 голос
/ 11 апреля 2010

Один момент, который я хотел бы предложить, заключается в том, что когда вы расширяете их, просто убедитесь, что вы просто используете глаголы вместо того, чтобы использовать прилагательные в качестве имен для классов, и вы должны быть хорошими!

Edit:

Я согласен с другими точками имен классов, представляющими, для чего он используется, а не точно, что он делает.

0 голосов
/ 11 апреля 2010

Обычные CSS-классы слишком гранулированы и способствуют возникновению проблемы классицизма. Псевдоселекторы могут в некоторой степени смягчить проблему. Предполагая, что разрабатывается новый веб-сайт, я бы сделал следующее:

*{
margin:0;
padding:0
}

li {
list-style: none; 
list-style-image: none;
}

Остальные трудно решить, floatLeft и floatRight должны определяться макетом,

<div id="main">
<div class="searchPanel">
</div>
<div class="resultsPanel">
</div>
</div>

CSS в идеале должен выглядеть (в зависимости от макета) #main searchPanel { плыть налево; } #main resultsPanel { плавать: правильно; }

Надеюсь, вы поняли идею. Однако, я сталкиваюсь с проблемами с жирным / подчеркнутым текстом. Подчеркнутый текст указывает на уродливый дизайн. Пользователи склонны путать такие с гиперссылками

0 голосов
/ 11 апреля 2010

некоторые рекомендации:

  1. .floatLeft -> .float-left: без верблюдов.

  2. .bold -> .important имя должно указывать цель не показывая как это сделать

  3. .nobullet -> ul.nobullet Лучше быть максимально указанным, чтобы избежать конфликта с другими CSS.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...