Как я иду через CSS tutorial я заметил следующие CSS дублированных селекторов:же селектор CSS используется дважды
body {
text-align: center;
}
body {
background: #193549;
color: white;
font-family: 'helvetica neue', sans-serif;
font-weight: 100;
font-size: 50px;
}
Есть ли какое-либо преимущество, чтобы положить некоторые свойства CSS в отдельном селекторе CSS? Что пытается достичь автор?
Никакой выгоды, кроме личных предпочтений. Например, группировка вещей, которые объединяются, поэтому их легче читать или обновлять/удалять. У вас могут быть стили по умолчанию body, а затем несколько уникальных стилей для body, которые вы добавили для поддержки плагина или чего-то еще, поэтому у вас может быть отдельная запись для body для уникальных стилей плагина, которые вы группируете с другими стилями, определенными для плагина, так что это легче читать/находить стили, относящиеся к плагину.
Это также плохая практика написания CSS как это. Он использует дополнительное пространство (делая ваши файлы более крупными) и затрудняет очистку и отслеживание изменений стиля.
Свойства класса должны быть консолидированы для лучшего обслуживания и согласованности.
Нет никаких преимуществ при использовании нескольких блоков CSS. Это может вызвать сердечную боль позже, если они находятся в разных файлах, потому что последнее свойство, указанное в списке, «победит».
Так что, если второй body также имеет text-align, то второй будет «перезаписывать» первый.
В любом случае, если это тот же селектор, они должны быть в одном блоке CSS.
Если они находятся в одном файле, нет, нет никакой разницы/выгоды. Однако, если они размещены в отдельных файлах, они могут иметь разные эффекты на разных страницах. –
, в этом случае они находятся в одном файле, рядом друг с другом, как вставляемые. – Tee