HTML и CSS
21.08.2021
На первый взгляд принцип его работы звучит просто: элементы с более высоким значением z-index отображаются поверх элементов с низким z-index. Но если не знать о контексте наложения, то результат может показаться странным. Для начала давайте разберемся с тем, как браузер по умолчанию позиционирует элементы…
22.06.2021
И это еще далеко не все возможности. Циклы позволяют выполнять какие-то множественные операции, например — вывести список пунктов меню. Миксины позволяют создавать многократно повторяемые блоки кода. Это практически то же самое, что и функции в языке программирования.
18.06.2021
Pug — это шаблонизатор и html-препроцессор, написанный на javascript для платформы Node.js, с целью ускорения верстки. Это даже быстрее, чем при использовании emmet — так что будет полезен любому веб-разработчику. Тем более, что освоить Pug можно за пару часов, синтаксис достаточно прост и интуитивно понятен.
11.06.2021
Плагин Live Server для VS Code позволяет перезагружать страницу после внесения измений в js, css, html код. Для установки надо перейти в раздел плагинов, набрать в поисковой строке «Live Server» и нажать кнопку «Установить». Теперь в правом нижнем углу есть кнопка «Go Live», которая запускает сервер.
05.06.2021
Для html-элемента нужно указать, какое css-свойство должно быть анимировано, и как оно должно быть анимировано. А когда свойство меняется, браузер сам обработает это изменение и отрисует анимацию. Другими словами, для запуска css-перехода — нужно просто изменить свойство, а дальше браузер все сделает сам.
04.07.2019
Создание горизонтального адаптивного меню для сайта осуществляется с помощью компонента «Navbar». Компонент имеет два режима отображения: десктопный (выводятся все элементы меню) и мобильный (отображается бренд и кнопка «Гамбургер»). Режим отображения зависит от ширины viewport браузера.
30.06.2019
Навигационная панель может быть реализована в виде ссылок, вкладок (tabs) или кнопок (pills). Создание панели начинается с маркированного списка, к которому добавляется базовый класс nav. Если к списку добавить класс nav-tabs — получим вкладки, если добавить класс nav-pills — получим кнопки.
30.06.2019
Сообщения (alerts) предназначены для выделения на веб-странице некоторой информации с целью привлечения к ней внимания пользователя. Наиболее часто данный компонент используют для отображения ошибок и предупреждений при валидации форм.
29.06.2019
Компонент предназначен для отображения на странице изначально скрытого контента. При появлении по какому-либо событию, модальное окно затемняет всю страницу и отображается поверх остальных элементов. Окно представляет собой контейнер, который содержит заголовок, основное содержимое и подвал.
28.06.2019
Компонент «Карточка» предназначен для оформления блока с текстом. Карточка имеет гибкую структуру — можно добавить шапку, подвал, список, картинку. Кроме этого, карточке можно придать нужное цветовое оформление — задать цвет фона, текста и границ.