Навыки Верстальщика

📚 Здесь собраны все вопросы, которые могут спросить на собеседовании. Теперь можно легко получить оффер, подготовившись к самым популярным вопросам. Просто выбери своё направление: 1. Frontend / JavaScript 2. Python 3. Java 4. Тестировщик QA 5. Data Science 6. DevOps 7. C# 8. С/C++ 9. Golang 10. PHP 11. Kotlin 12. Swift

Свойство mix-blend-mode Определяет, как цвета и изображения в элементе должны смешиваться с его фоном или содержимым В нашем примере рассмотрим эффект наложения цвета с картинкой с помощью данного свойства 👆 ⚡️ Навыкиверстальщика | CSS

🔥Тесты для подготовки к собеседованию🔥 Выбери своё направление: 1. Frontend 2. Python 3. Java 4. Тестировщик QA 5. Data Science 6. DevOps 7. C# 8. С/C++ 9. Golang 10. PHP 11. Kotlin 12. Swift

@media (any-hover: hover) Позволяет отключить ховер эффект на устройствах которые не имеют функциональности ховера 👇

@media(any-hover: hover) {
  .btn:hover {
      background-color: #fff;
      color: #000;
    }
}

Зачем вообще отключать ховер? Самое очевидное - улучшения производительности Отключение ховера на устройствах без поддержки может помочь улучшить производительность, поскольку браузеру не нужно обрабатывать события ховера и применять связанные стили, что может сэкономить ресурсы и ускорить отзывчивость интерфейса ⚡️ Навыкиверстальщика | CSS

Разбираем как решать задачи на LeetCode ✅ Примеры решений ✅ Пояснения Выбери своё направление: 1. JavaScript 2. Python 3. Java 4. C# 5. C/C++ 6. Golang 7. PHP 8. Kotlin 9. Swift

CSS свойство columns используется для создания многоколоночного текстового макета. Это позволяет разделить текст на колонки, что особенно полезно для улучшения оформления текстового контента на сайте Вот некоторые особенности и возможности свойства columns в CSS: 1. Разделение текста на колонки: - Свойство columns позволяет задать количество колонок и их ширину для разделения текста. - Текст будет автоматически распределен по заданным колонкам 2. Контроль над колонками: - Вы можете настроить различные параметры колонок, такие как ширина, отступы между колонками, разделители и другие стилизации. 3. Адаптивность: - Свойство columns позволяет создавать адаптивные многостолбцовые макеты, которые могут автоматически изменяться в зависимости от ширины родительского контейнера. ⚡️ Навыкиверстальщика | CSS

У топовых айтишников есть секрет, они работают не 8 часов, а головой! Понимают, что без английского в айти делать нечего. Поэтому в начале карьеры изучают технический английский, а потом смело прибавляют +40% к рыночной зарплате. Знают где в телеграме брать современные идеи и материалы для работы. Например, для web-разработчиков - это Сайтодел. Становись Senior-разработчиком. Всё просто, два клика: → Английский для программистов → Сайтодел 🎁 Бесплатно: Поиск разработчика для сайта и первый созвон по обучению английскому. Не упускай такую возможность!

@media print - интересная и полезная CSS возможность, которая позволяет создавать стили специально для печатной версии веб-страницы. Когда пользователь решает распечатать страницу, браузер автоматически применяет стили, определенные внутри @media print, что позволяет создавать версии страниц, оптимизированные для печати, без лишних элементов, таких как навигация, боковые панели, футеры и другие несущественные детали, которые есть на веб-странице, но не нужны на распечатке.

Пример использования

@media print {
  body {
    font-size: 12pt;
  }
  a {
    text-decoration: none;
    color: black;
  }
  .no-print {
    display: none;
  }
}

В этом примере заданы следующие стили для печати: - Увеличение размера шрифта всего документа до 12 пунктов, что делает текст более читабельным на печатной версии. - Убирается подчеркивание у ссылок и они выводятся черным цветом, чтобы они выглядели на бумаге как обычный текст, даже если цветовая гамма экрана и печати различается. - Элементы с классом .no-print будут полностью скрыты при печати, что удобно для исключения из печатной версии ненужных элементов веб-страницы, например, кнопок управления. ⚡️ Навыкиверстальщика | CSS

Хватит терять время на уже готовый код! Frontend Trends — библиотека фронтендера, где собраны готовые CodePen решения для ежедневных задач. Эффекты при наведении, 3D-анимации, готовые карточки и др. Зашли – сохранили – применили в своём проекте. Пользуйтесь: @trends_frontend

Правило @supports в CSS - это условное групповое правило, которое позволяет применять блок стилей только в том случае, если определенное условие истинно. Оно проверяет, поддерживает ли браузер определенное свойство CSS , прежде чем применять стили внутри блока. В нашем случае стили внутри блока @supports будут применены только в том случае, если браузер поддерживает свойство display: grid . Если условие не выполняется, стили внутри блока будут проигнорированы. ⚡️ Навыкиверстальщика | CSS