Что если я скажу вам, что вам нужно знать только 3 свойства CSS, чтобы создать полностью адаптивную CSS сетку, показанyю ниже:

Давайте начнем с HTML кода.

Syntactically awesome style sheets или сокращенно SASS – это CSS препроцессор, который позволяет разработчикам писать код на одном языке, а затем компилировать его в другой. SASS – это расширение CSS, которое позволяет вам создавать ваш код быстрее и делать его чище.

Здесь, в Weeare, мы используем SASS, чтобы сократить время разработки и держать наш CSS-код более упорядоченным. В этой статье мы расскажем, как понять основы SASS за 20 минут или даже меньше. В зависимости от отзывов об этом уроке мы можем публиковать дополнительные обучающие статьи на этом сайте.

В пользовательских CSS-библиотеках нет недостатка – вы можете выбрать любую: от Bootstrap до Foundation. А если вам нужна простая и легкая библиотека для использования в новых проектах? Многие из существующих CSS-библиотек не подойдут, так как они тяжелы изо того, что они содержат излишние возможности. Хорошо, что есть Milligram – супер-легкая альтернатива, которая «весит» всего 8 Кб в сжатом виде. Вы можете установить его через Bower или NPM, также загрузить и разместить локально или подключить через CDN.

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

В первой части краткого руководства, мы начали изучать CSS-переменные. Разобрались, что это такое и почему мы должны их использовать. Сейчас мы рассмотрим другой важный момент, который вы не должны упускать из вида в процессе работы – область видимости CSS-переменных.