Суть такова, что хочу разработать некий стандарт вёрстки блоков, для этого пытаюсь проанализировать, в каком порядке правильно верстать блоки.
Вот пример для анализа:
На данный момент порядок такой:
1) html - Создаём контейнер, в котором находится блок
2) html - Создаем рамку блока, которая будет позиционировать наш блок относительно контейнера
3)html - Cоздаем блоки для контента
4)html - Прописываем контент и иконки сооветственно
5)html - Присваиваем блокам и элементам классы для дальнейшего прописывания стилей
6)Запускаем eCSStractor и генерим css файл, я пишу в sass, соответственно конвертим оформление css-sass и сохраняем в наш общий стилевой файл (main.sass, к примеру)
7)html - Настраиваем позиционирование рамки внутри главного контейнера (нам надо по центру), если подключен bootstrap, container делает работу за нас (по горизонтали).
8)Настраиваем позиционирование внутренних блоков, а также размеры, margin,padding рамки самой рамки
9)Настраиваем позиционирование, размеры, margin,padding блоков с контентом
10)Теперь, когда всё на своих местах - настраиваем оформление в следующем порядке
Сначала положение элемента относительно других: position, left/right/top/bottom, float, clear, z-index.
Затем размеры и отступы: width, height, margin, padding…
Рамка border, она частично относится к размерам.
Общее оформление содержимого: list-style-type, overflow…
Цветовое и стилевое оформление: background, color, font…
Прошу подсказать, как лучше и что доработать.
Простой
Простой
