Организация файлов CSS с множеством точек останова и множеством шаблонов

Я начинаю изучать CSS, HTML и Sass, и, хотя я понимаю основы, я хотел бы начать знакомиться с лучшими практиками. Я создаю адаптивный веб-сайт портфолио (используя Bones HTML5 Boilerplate и Wordpress), который будет иметь 4-5 точек останова, а также ~ 5 различных шаблонов статического сайта.

Мои точки останова импортируются на основе запросов мультимедиа из кода в нескольких файлах .scss, например:

_base_res.scss
_481_and_up.scss
_768_and_up.scss
_1030_and_up.scss

Прямо сейчас у меня также есть несколько статических страниц, внутри которых есть медиа-запросы:

_home.scss
_about.scss
_contact.scss
_work.scss

Является ли излишним иметь статические css-файлы страниц, содержащие медиа-запросы, а также css-файлы точек останова? Должен ли я просто иметь классы .home, .about, .contact, .work в файлах scss точек останова?

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

Спасибо


wordpress html css sass html5boilerplate
person kyle    schedule 11.11.2014    source источник
comment
Я бы сказал, что это ваше решение. Я один из тех людей, которые будут писать медиа-запросы для каждого элемента и выбирать ширину для запросов на основе моего контента, а не, например, для мобильных устройств, планшетов и настольных компьютеров, что сделало бы файлы медиа-запросов излишними. Гораздо проще сгруппировать каждый стиль в моем элементе, и я думаю, что это то, что имели в виду дерзкие люди, иначе зачем бы вы могли группировать медиа-запросы внутри элемента.   -  person KreaTief    schedule 11.11.2014

Ответы (1)


arrow_upward
0
arrow_downward

Я бы посоветовал прочитать и о https://smacss.com/, это научит вас создавать хорошую архитектуру css. Также я бы порекомендовал написать миксин, который позволит вам передавать переменные медиа-запроса. Как только это будет сделано, запишите свои медиа-запросы там, где они вам нужны, а не в определенных таблицах стилей.

person alexmattorr    schedule 14.04.2015