Публикации по сайтостроению
CSS-свойства display: none и visibility: hidden могут быть использованы для скрытия элементов на странице. Однако, они работают по-разному и имеют свои особенности. В этой статье мы рассмотрим различия между этими свойствами и как использовать их […]
Специфичность селекторов определяет какие именно стили применить к элементу, если на него влияют сразу несколько css правил с разными селекторами. У какого правила это значение выше, то и применится для элемента. По-простому специфичность можно назвать […]
Делаем анимированное бургер меню без использования скриптов Для создания появляющегося гамбургер меню нам понадобится такая html структура: <div class=»menu»> <input type=»checkbox» id=»burger-checkbox» class=»burger-checkbox»> <label for=»burger-checkbox» class=»burger»></label> <ul class=»menu-list»> <li><a href=»#» class=»menu-item»>Главная</a><li> <li><a href=»#» class=»menu-item»>О нас</a><li> […]
Верстаем бургер кнопку Добавляем в html кнопку с классом burger <button class=»burger»></button> Далее идем в CSS и задаем размер нашей кнопке и сбрасываем стандартные стили фона и границ. Верхнюю и нижнюю линии мы создадим с […]
Разработка адаптивной типографики может сбить с толку. Какие единицы вы должны использовать для размера шрифта: px, em, rem, vw? Как вы можете убедиться, что ваши шрифты доступны? И что такое гибкая типографика? В этой статье […]
Вариант 1 Можно настроить работу с помощью Lint-staged: https://habr.com/ru/companies/ruvds/articles/428173/ Вариант 2 Или можно использовать упрощенный (?) вариант настроек: https://typicode.github.io/husky/get-started.html Прописываем в настройках — файл pre-commit следующее (все что было в нем изначально можно стереть): #.husky/pre-commit […]
//Скрипт плавной прокрутки до якоря $(document).ready(function(){ $(«nav.list»).on(«click»,»a», function (event) { //отменяем стандартную обработку нажатия по ссылке event.preventDefault(); //забираем идентификатор блока с атрибута href var id = $(this).attr(‘href’), //узнаем высоту от начала страницы до блока на […]
Maksis.ru © 2025 | При использовании материалов сайта активная ссылка на Maksis.ru обязательна.