Frontend Portal

Маскирование в CSS c помощью свойства mask Cвойство устанавливает изображение, которое используется как слой маски для элемента

<img src="picture.jpg" alt="...">

Свойство определяется подобно background:

img {
    mask: url("../shape.png");
    mask-repeat: no-repeat;
    mask-size: cover;
    mask-position: center;
}

Либо можно записать в одну строку, как на картинке Подробнее — статья 👉 @FrontendPortal | #CSS

Desert Racer: Первая игра, разработанная исключительно на CSS с возможностью управления свайпом Я разработал игру Desert Racer, чтобы показать уникальные и инновационные приемы, которые используют только CSS, включая функционал свайпа и детектирования столкновений, выполненные исключительно средствами CSS. На мой взгляд, это первые в своем роде решения. В данной статье мы рассмотрим упомянутые техники и обсудим общие этапы создания игры со свайп-управлением Читать дальше: статья Вот демка: тык 👉 @FrontendPortal | #js #article

⚡️Фронтендеры гении разработки⚡️ Да я так считаю, хоть я начинающий фронт разработчик. Веду свой дневник разработки и всех призываю в канал для обмена опытом, так как хочу стать супер кодером Жду в комментариях к постам разборы, какой я криворукий и как бы ты сделал лучше. Бекендеры тоже приходите, может научитесь программировать

Сокращения CSS в Emmet Emmet - это очень полезный инструмент, который входит в состав многих текстовых редакторов и IDE, таких как VS Code Хотя Emmet в основном полезен для генерации HTML из аббревиатур, он может быть полезен и для CSS! Вот несколько интересных cокращений, которые помогут вам писать CSS очень быстро ⚡️ 👉 @FrontendPortal | #vscode

CSSBattle — это онлайн-игра в Code Golfing. Здесь вы пытаетесь визуально повторить "Цели" за минимально возможное количество строчек CSS-кода и сразиться с игроками со всего мира, чтобы попасть на вершину таблицы лидеров 🔗 Ссылка: https://cssbattle.dev/ 👉 @FrontendPortal | #resourse

🖥 React - теперь в телеграм! - 45,14% разработчиков сайтов использовали React в 2024 году — это самая популярная библиотека для создания пользовательских интерфейсов; - 221 850 звёзд у React на GitHub; - 27,12% разработчиков хотят изучить React; - 17.9 млн раз пользователи установили React В канале React JS мы разбираем на пальцах дизайн и код современный Frontend на примерах и делимся с вами. Никакой воды, только практика и лучшие инстурменты. А здесь мы собрали крутую Frontend папку, которая поможет вам подняться на новый уровень. Подписывайтесь, потом сами себе спасибо скажете: @react_tg

Battery Status API Через Battery Status API можно получить доступ к информации о батарее устройства

navigator.getBattery().then((batteryManager) => console.log(batteryManager));

Интерфейс BatteryManager позволяет взаимодействовать с Battery Status API и предоставляет доступ к информации об уровне заряда батареи устройства. Метод navigator.getBattery() возвращает промис, содержащий объект типа BatteryManager Полный код — Codepen Подробнее — Статья 👉 @FrontendPortal | #js

👇 | #викторина

WEBIK - это IT-проект, который ежедневно выпускает: - Крутые Рецепты кода - Смешные мемы - Красивые макеты - Позновательные викторины Присоединяйся, и кайфуй от полезного и бесплатного материала! 😎