WebGradients представляет собой бесплатную коллекцию из 180 линейных градиентов, которые можно использовать в качестве фонов для любых элементов вашего веб-сайта. Эти градиенты легко интегрировать благодаря кроссбраузерному CSS3-коду, который можно быстро скопировать и использовать. Также доступны PNG-версии каждого градиента, что позволяет примменять их даже без написания кода.
Made in HTML/CSS
Made in HTML/CSS
👍11
This media is not supported in your browser
VIEW IN TELEGRAM
Свойство scroll-behavior в CSS определяет, как происходит прокрутка внутри элемента или всего документа. Оно может принимать значения auto, smooth.
Значение smooth позволяет включить плавную прокрутку, делая переходы более мягкими и приятными для пользователя.
Made in HTML/CSS
Значение smooth позволяет включить плавную прокрутку, делая переходы более мягкими и приятными для пользователя.
Made in HTML/CSS
🔥6
BGJar — это бесплатный генератор SVG-фонов для ваших веб-сайтов, блогов и приложений. Он предлагает широкий выбор настраиваемых фоновых изображений, которые можно легко интегрировать в ваш проект. Эти SVG-фоны адаптивны и поддерживают масштабируемость, что делает их идеальными для использования на различных устройствах и экранах.
Made in HTML/CSS
Made in HTML/CSS
👍3🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
В HTML используются элементы <input type="radio"> для создания радио-кнопок, которые позволяют выбрать один из нескольких вариантов. Каждый элемент <input> обернут в <label>, чтобы увеличить область клика.
В CSS применяются псевдоэлементы ::before и ::after для создания визуальных эффектов, таких как фон и анимация. Селекторы состояния, такие как :hover и :checked, изменяют стили при наведении и выборе. Анимации и переходы делают изменения плавными, а Flexbox помогает выровнять элементы. Свойство appearance: none убирает стандартный вид радио-кнопок, позволяя задать свой стиль.
Made in HTML/CSS
В CSS применяются псевдоэлементы ::before и ::after для создания визуальных эффектов, таких как фон и анимация. Селекторы состояния, такие как :hover и :checked, изменяют стили при наведении и выборе. Анимации и переходы делают изменения плавными, а Flexbox помогает выровнять элементы. Свойство appearance: none убирает стандартный вид радио-кнопок, позволяя задать свой стиль.
Made in HTML/CSS
👍6🔥1👨💻1
GitLens — это мощное расширение для Visual Studio Code, которое значительно улучшает работу с Git, предоставляя дополнительные инструменты и функции для управления версиями кода.
С помощью GitLens вы можете:
Просматривать историю изменений: Легко отслеживать, кто и когда вносил изменения в код (особенно полезно в командной работе).
Сравнивать ветки и коммиты: Быстро видеть различия между ветками или коммитами.
Использовать улучшенные аннотации: Видеть, кто является автором каждой строки кода прямо в редакторе, что помогает в отладке и ревью кода.
Made in HTML/CSS
С помощью GitLens вы можете:
Просматривать историю изменений: Легко отслеживать, кто и когда вносил изменения в код (особенно полезно в командной работе).
Сравнивать ветки и коммиты: Быстро видеть различия между ветками или коммитами.
Использовать улучшенные аннотации: Видеть, кто является автором каждой строки кода прямо в редакторе, что помогает в отладке и ревью кода.
Made in HTML/CSS
👍5🔥2
place-items — это удобное CSS-свойство, которое позволяет быстро центрировать или выравнивать элементы внутри контейнера по вертикали и горизонтали одновременно.
Оно объединяет два свойства: align-items (выравнивание по вертикали) и justify-items (выравнивание по горизонтали).
Made in HTML/CSS
Оно объединяет два свойства: align-items (выравнивание по вертикали) и justify-items (выравнивание по горизонтали).
Made in HTML/CSS
🔥9
This media is not supported in your browser
VIEW IN TELEGRAM
Auto Rename Tag - плагин для Visual Studio Code, предназначенный для автоматического переименования парных HTML/XML-тегов. Этот инструмент значительно упрощает работу с разметкой, особенно когда требуется изменить имя тега.
Made in HTML/CSS
Когда вы изменяете открывающий тег, закрывающий тег автоматически обновляется, и наоборот.
Made in HTML/CSS
🔥7👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Проект представляет собой анимацию 3D-кубов, вращающихся с различными углами и скоростями. Кубы располагаются в сетке и имеют уникальные анимации, создающие динамичный визуальный эффект.
Made in HTML/CSS
Made in HTML/CSS
🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
CSS Peek - плагин для Visual Studio Code (VS Code) предназначен для улучшения работы с CSS, предоставляя разработчикам возможность быстро находить и просматривать стили, применяемые к элементам HTML.
Made in HTML/CSS
Made in HTML/CSS
👍6🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
Загрузка с размытием в JavaScript — это технология, которая позволяет отображать размытое изображение с низким разрешением до загрузки его полной версии.
Made in HTML/CSS
Made in HTML/CSS
👍6🔥2
Удивительный инструмент для тренировки навыков — BigDevSoon!
Это платформа задачами, которые помогут улучшить ваши умения. Здесь вы найдете задания на любой вкус: от базовой верстки до сложных проектов с JavaScript, анимациями и другими веб-технологиями.
Особенности платформы:
★ Классификация проектов по уровням сложности — junior, regular и senior.
★ Дизайны Figma для каждого проекта.
★ Игровая система для отслеживания прогресса.
🌐 Прочитать статью
Made in HTML/CSS
Это платформа задачами, которые помогут улучшить ваши умения. Здесь вы найдете задания на любой вкус: от базовой верстки до сложных проектов с JavaScript, анимациями и другими веб-технологиями.
Особенности платформы:
★ Классификация проектов по уровням сложности — junior, regular и senior.
★ Дизайны Figma для каждого проекта.
★ Игровая система для отслеживания прогресса.
🌐 Прочитать статью
Made in HTML/CSS
🔥4👍3
This media is not supported in your browser
VIEW IN TELEGRAM
3d ротация при наведении позволяет карточки обрести объёмный вид за счет 3d анимации.
Очень полезное свойство, если вы хотите оживить ваши картинки
Made in HTML/CSS
Очень полезное свойство, если вы хотите оживить ваши картинки
Made in HTML/CSS
👍8
This media is not supported in your browser
VIEW IN TELEGRAM
Плагин HTML to CSS для Visual Studio Code упрощает процесс написания и управления CSS-стилями для HTML-элементов. Среди его основных возможностей выделяется автоматическая генерация CSS (Создает базовые стили для HTML-элементов, что удобно для начальной настройки или быстрого прототипирования) и извлечение классов и ID (Извлекает имена классов и ID из HTML и создает соответствующие CSS-селекторы)
Made in HTML/CSS
Made in HTML/CSS
👍8
This media is not supported in your browser
VIEW IN TELEGRAM
Плагин Live Sass Compiler для Visual Studio Code упрощает процесс компиляции Sass/SCSS в CSS в реальном времени. Среди его основных возможностей выделяется автоматическая компиляция (Преобразует Sass/SCSS в CSS при сохранении файла, что удобно для быстрого прототипирования) и живой предпросмотр (Позволяет видеть изменения в браузере в реальном времени).
Made in HTML/CSS
Made in HTML/CSS
👍6
This media is not supported in your browser
VIEW IN TELEGRAM
Этот проект создает визуально привлекательный эффект радужного свечения, который можно использовать для выделения элементов на веб-странице.
Made in HTML/CSS
Made in HTML/CSS
🔥9
UnoCSS — атомарный CSS-движок, который динамически генерирует утилитарные классы на основе HTML и конфигурации.
Он разработан для быстрой и гибкой разработки, поддерживает широкий набор пресетов и опций настройки.
UnoCSS сканирует шаблоны на наличие имён классов и генерирует только тот CSS, который действительно используется, минимизируя конечный размер пакета.
🌐 Читать статью
Made in HTML/CSS
Он разработан для быстрой и гибкой разработки, поддерживает широкий набор пресетов и опций настройки.
UnoCSS сканирует шаблоны на наличие имён классов и генерирует только тот CSS, который действительно используется, минимизируя конечный размер пакета.
🌐 Читать статью
Made in HTML/CSS
👍5
This media is not supported in your browser
VIEW IN TELEGRAM
Калькулятор позволяет пользователю вводить числа и выполнять базовые арифметические операции: сложение, вычитание, умножение и деление.
Интерфейс состоит из кнопок для ввода чисел и операций, а также поля для отображения текущего ввода и результата вычислений. JavaScript управляет логикой калькулятора, обрабатывая нажатия кнопок и выполняя вычисления.
Made in HTML/CSS
Интерфейс состоит из кнопок для ввода чисел и операций, а также поля для отображения текущего ввода и результата вычислений. JavaScript управляет логикой калькулятора, обрабатывая нажатия кнопок и выполняя вычисления.
Made in HTML/CSS
🔥6
Сайты усложняются, и требования к скорости их загрузки растут. Вручную сжимать файлы и очищать проекты — долго.
Gulp — программа, которую используют фронтенд-разработчики, чтобы автоматизировать задачи вроде сжатия CSS и JavaScript, оптимизации изображений, объединения файлов.
🌐 Читать статью
Made in HTML/CSS
Gulp — программа, которую используют фронтенд-разработчики, чтобы автоматизировать задачи вроде сжатия CSS и JavaScript, оптимизации изображений, объединения файлов.
🌐 Читать статью
Made in HTML/CSS
👍8🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Этот код представляет собой простой веб-переводчик, созданный с использованием HTML, CSS и JavaScript.
Можно использовать готовое API какого-нибудь переводчика. Или же, если уж хотите прям свой маленький переводчик, можно подготовить заранее свой список "вопросов - ответов".
Made in HTML/CSS
Можно использовать готовое API какого-нибудь переводчика. Или же, если уж хотите прям свой маленький переводчик, можно подготовить заранее свой список "вопросов - ответов".
Made in HTML/CSS
🔥6