Уроки SASS / SCSS

Урок #4 - Использование миксинов

Урок #4 - Использование миксинов

Для сокращения кода в SASS используются специальные шаблоны со свойствами - миксины. В ходе урока вы научитесь создавать миксины, передавать в них параметры, а также использовать их для различных объектов.

Видеоурок

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


Для создания миксина используйте ключевое слово @mixin:

@mixin someName {
	// Здесь код и различные стили
}

Миксины не срабатывают без явного подключения, поэтому сейчас в файле CSS ничего не поменяется. Для подключения миксина используйте ключевое слово @include.

#block {
	@include someName;
}

Также в миксины можно передавать параметры. Для этого после имени миксина пропишите круглые скобки ( ), после чего в них пропишите параметры, которые будут переданы в него.

Материалы для курса

Чтобы скачивать материалы к видеокурсам необходимо оформить подписку на сайт

Исходный код

Весь код будет доступен после подписки на проект!

Онлайн редактор кода

Загрузка...

Задание к уроку

Необходимо оформить подписку на проект, чтобы получить доступ ко всем домашним заданиям

Большое задание по курсу

Вам необходимо оформить подписку на сайте, чтобы иметь доступ ко всем большим заданиям. В задание входит методика решения, а также готовый проект с ответом к заданию.
PS: подобные задания доступны при подписке от 1 месяца

Также стоит посмотреть

Создание адаптивного сайта
4 урока
Изучение CSS/CSS3 для новичка: от нуля до гуру
10 уроков
Современная вёрстка адаптивного веб-сайта
Вёрстка адаптивного сайта на Bootstrap 4
6 уроков
Верстка сайта на HTML5 и CSS3
13 уроков
Видеокурс по PHP, MySQL / Создание динамического сайта
Комментарии
Добавить комментарий

Пока комментариев нет