Как бороться с необходимостью менять имена классов CSS

Question

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

Представьте, что у вас есть таблица продуктов с хорошим семантическим именем класса products. Это правильно оформлено в вашей таблице стилей. Через несколько месяцев ваш босс попросит вас создать список сотрудников на сайте, «в точности такой же, как и список продуктов».

Это немедленно поднимает важный вопрос: что назвать новым штатным расписанием. Единственными вариантами, которые я могу придумать, являются:

• Дайте ему название класса products. Это самое быстрое решение, но разрушает семантику. Именование не имеет особого значения, особенно для будущих разработчиков.
• Измените имя класса на то, что может охватывать как продукты, так и списки персонала. Это будет отрицать полезность разделения разметки из стиля, поскольку HTML будет нуждаться в изменении. Кроме того, я не могу придумать ни одного не-презентационного класса, которое могло бы быть применимо к продуктам и список сотрудников.
• Введите новое имя класса и отредактируйте файл CSS таким образом, чтобы .products { ... } стал .products, .staff { ... }, а .products thead th.number { font-weight: bold } стал .products thead th.number, .staff thead th.number { font-weight: bold } и т. Д. Еще одно уродливое решение, которое со временем будет усложняться.

Каков наилучший способ действий здесь?

N.B. Я уверен, что эту проблему легко решить с помощью таких фреймворков, как LESS (я не использовал ее лично), но это решение меня больше привлекает как «прикрытие», чем реальное средство.

Answer 1

Как насчет Вариант 4:

сделать копию «продукты», как «персонал» и продолжать работать над ними отдельно, как время идет.

Answer 2

Если вам нужно было положить свой стиль стола в несколько слов, что бы это было? Я пытаюсь использовать это, чтобы назвать стили, которые я использую gunna в более чем одном месте. Тогда у меня есть представление о том, как это будет выглядеть, если я буду использовать класс.

Пример:

.table полосатые {}

Answer 3

Это одна из вещей, которые я действительно не нравится CSS. Со всеми мощными языками в нашем распоряжении, это просто кажется искалеченным от выхода, чтобы обрабатывать очень распространенные сценарии, подобные вашим. Я тоже все время борюсь с этим и заканчиваю тем, что либо копировал весь класс, связанный с продуктом, либо свой новый, либо добавляя свой новый в .product. Их можно было вытащить позже.

Мне нужно учиться на предварительных процессорах, потому что то, что я хотел бы сделать, - это что-то такое, что OOP-y - определить базовый класс b, который и .product и .mynewone наследуют и уходят оттуда.

Но # 3 - ваш лучший выбор ИМО.

Answer 4

Я собираюсь с first option, потому что если все одинаково & там просто изменение содержания.Итак, лучше использовать предыдущий класс products для сотрудников также &. Вы можете отдельно определить свою панель персонала с помощью комментария <-- staff plan--> внутри HTML-страницы.

Answer 5

Хм ...

В основном корень проблема заключается в том, что исходная мысль о создании первого класса стиля (.products) была слишком узко названа. Не всегда возможно знать, что вам нужно будет повторно использовать значительную часть определения CSS в более поздней точке, но на основе вашего вопроса кажется, что вы находитесь в этой сфере деятельности.

Структура CSS ядро ​​не имеет способа сказать «сделать мой новый стиль (.staff) быть таким же, как другой стиль (.products) с этой ручной коррекцией»

Но я считаю, что МЕНЬШЕ рамка действительно дает вам возможность определять класс (.coolTable) со всеми свойствами и повторно использовать эти свойства в нескольких других определениях класса (.products и .staff) быстро.

Структура LESS не является «прикрытием», а расширением возможностей CSS.

Answer 6

Я бы с первым вариантом, чтобы иметь класс products с этим блоком .... или, может быть, как class="products staff"

Таким образом, я не буду иметь повторяющиеся стили (даже от будущих аспектов, когда код/​​стилей может сильно измениться), и любые конкретные стили для продуктов могут быть сделаны следующим образом новым классом (или другим способом использования родительского класса в стилях, чтобы дать более специфику стилей).

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

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

Answer 7

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

На практике большинство ремонтопригодное решение обычно пытается найти общее имя для разных вещей, идентичных тождественно.

Answer 8

Здесь в основном две школы мысли.

1) Стиль, который следует разметке 2) Разметка, которая следует за стилем.

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

Во-первых, у вас есть разметка набора, которая не изменяется. Вы определяете стиль, чтобы он выглядел так, как вы хотите. Это находится в жилом саду css zen. Это требует, чтобы ваша разметка была очень семантической. Недостатком является то, что у вас часто много повторяющихся стилей, потому что при использовании этого метода не всегда можно стильно стирать.

Во-вторых, вы создаете множество общих стилей, а затем приспосабливаете свою разметку к стилям. Например, у вас могут быть классы «float», «thinBorder», «bold», затем применить эти стили к вашей разметке. Недостаток здесь заключается в том, что если ваш стиль нуждается в изменении, вам нужно изменить HTML (или выделить полужирным шрифт, или некоторые из них). Положительным является то, что ваш CSS намного чище и удобен в обслуживании.

Это отстой, но вам нужно сделать компромиссы.