2008-10-28 6 views
3

Если у меня есть имена классов, такие как «левый», «вправо», «ясно» и XHTML, какиспользует имена классов, такие как «правая» считается плохой практикой?

<a href="index.php" class="right continueLink">Continue</a> 

С помощью CSS, как

.right { 
float: right; 
} 

Я знаю, что это не смысловое имя, но иногда делает вещи намного легче.

В любом случае, что вы думаете?

+0

Согласно Bootstrap, `pull-right` в порядке. – alex 2015-07-03 07:09:27

ответ

14

Я не думаю, что это очень хорошая идея. Теперь, когда вы (или будущий сопровождающий) поменяете свой макет сайта, вам придется либо изменить .right на {float:left;} (очевидно, плохая идея), либо просмотреть все ваши файлы HTML и сменить right на left.

Почему вы хотите, чтобы эта конкретная ссылка плавала вправо, а другая .continueLink не в? Используйте ответ на этот вопрос, чтобы выбрать более описательное имя класса для этой ссылки.

+0

Я согласен с вами. Я редактировал существующую систему, которая не заботилась о семантике, поэтому я решил сделать жизнь проще для себя, выполнив это с помощью CSS. Хотя я никогда не делал этого для своих проектов. – alex 2008-10-28 04:58:08

+1

Почти во всех случаях я полностью согласен с вами. Однако есть один случай, который я просто не могу решить, кроме как с помощью «левого» и «правильного»: размещения плавающих изображений внутри статьи. Точный выбор более или менее произволен; нет ничего другого, чтобы отличать изображения. – 2008-10-29 19:36:45

+0

В случае, о котором говорит Бобби Джек, я бы сказал, что все в порядке. Хотя вы можете упростить разметку, если Javascript добавит эти классы ко всем другим изображениям, чтобы изменения направления с плавающей точкой изменились. – 2008-11-06 15:59:04

1

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

Помимо этого, я не вижу проблем. Я бы назвал право или левое имя следующим: menuleft, menuright и т. Д.

6

css есть о представлении вашей html-страницы.

Значение его классов должно представлять структуру документа («статья», «дополнительные ссылки», «глоссарий», «введение», «заключение», ...).

Вы должны избегать любого класса, связанного с физического представления («левого», «правая», «Сноска», «sidenotes», ...), потому что, как Zen Garden так ясно показывает, что вы можете решить поместить любой div по-разному и по-разному.

+0

Вы правы, но «сноски» - плохой пример, поскольку на самом деле он описывает структурный элемент документа (независимо от того, где он выложен). это ничем не отличается от «HEADing» – nickf 2008-10-28 08:18:26

+0

. Я знал, что вы скажете это ;-) НО, но определение сносок явно относится к «нижней части страницы», «физическому» местоположению. Я бы предпочел более общий термин, например, «комментарии» или «связанные» или просто «заметки». См. Http://dictionary.reference.com/browse/footnote – VonC 2008-10-28 09:48:55

2

Пуристы скажут, что не делайте этого, и прагматисты скажут, что все в порядке. Но будут ли пуристы определять .right как float: left?

1

Будучи пуристом, я говорю, что нет, не делайте этого. По причинам, упомянутым ранее.

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

Вышеупомянутое то, что коллеги-пуристы часто часто игнорируют, хотя это реальность. Но нижняя линия; Нет, не используйте className, например «right». :-)

0

.правые и другие классы, подобные этому, безусловно, позволяют быстро создать тег с приложением float:right, но я считаю, что этот метод имеет больше недостатков, чем преимущества:

Часто классный стиль с одним float:right; в нем не будет чего-то, ваш пример wil будет плавать только в том случае, если в правиле другого класса содержится display:block, поскольку тег «a» не является элементом уровня блока. Также плавающие элементы чаще всего имеют ширину, приложенную к высоте. Это означает, что код в вашем примере нуждается в дополнительном коде, чтобы делать то, что он говорит, и вам нужно искать в двух местах, когда вам нужно изменить свой css.

Я склоняюсь к стилю своего html, разделив страницу на разные div-теги с уникальными идентификаторами, а затем стилизуя элементы в этих div по наследству.

div#sidebar { float:right; width:200px; } 
div#sidebar ul { list-style-type:none; } 

Это позволяет разделить мои файлы CSS, так что легко найти CSS-кода, что стили определенный тег, но если ввести .right и другие классы, начинают расходиться правила в разные области файла css, что делает сайт более сложным в обслуживании.

Я думаю, что идея иметь очень общие классы рождается из желания сделать возможным изменение всего макета сайта, изменив пару правил в таблице стилей, но я должен сказать, что за 8 лет разработки сайта с 30+, разных сайтов под моим поясом я ни разу не изменил макет сайта и повторно использовал HTML.

То, что я делал бесчисленное количество раз, делает небольшие корректировки в регионах страниц либо из-за небольших изменений дизайна, либо для внедрения новых браузеров. Поэтому я все хочу, чтобы мой css делился на аккуратные куски, что позволяет легко находить правила, которые я ищу, и не помещать код в разных местах, чтобы достичь более короткой таблицы стилей.

С уважением Jesper Hauge

0

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

Возможно, «alt» - более подходящее имя класса.