css
(131)
Повне керівництво по Flexbox
Це повне керівництво пояснює все про flexbox, зосереджуючись на всіх можливих властивосях для батьківського елемента (контейнер flex) та дочірніх елементів (елементи flex). Воно також включає в себе історію, демонстрації, шаблони і таблицю підтримки...
Alex · 11 жовтня 2020 · 3.9K
Ресурси, що блокують рендеринг: як правильно їх позбутися
Ця стаття буде корисною, якщо Lighthouse коли-небудь казав вам «прибрати ресурси блокування рендерингу» (якщо не казав, то все одно можете дізнатись, як цього уникнути). Ресурси блокування рендерингу — поширена перешкода для швидкого завантаження ваш...
Codeguida · 21 вересня 2021 · 247
Маловідомі CSS-властивості
Існує багато CSS-властивостей, про які деякі дизайнери просто не знають. Або знають, але забувають використовувати ці властивості там, де вони здатні принести велику користь. Деякі з цих властивостей можуть допомогти відмовитися від використання Java...
Alex · 20 липня 2020 · 445
Як не гаяти час на завантаження невидимого контенту
Браузер не розрізняє невидимий вміст від видимого Зазвичай не весь вміст вебсторінки поміщається на одному екрані. Коли сторінка відкривається, браузер обчислює розміри та позиції всіх DOM-елементів на ній. Елементи завантажуються, навіть якщо більші...
Codeguida · 17 жовтня 2021 · 117
9 порад щодо оптимізації зображень для прискорення вашого сайту
У цій статті ми розглянемо ефективні методи оптимізації зображень, які значно покращать продуктивність вашого застосунку. Почнемо з самого початку! 1. Формати зображень Вибір правильного формату зображення для кожного типу зображення може суттєво впл...
Alex · 31 липня 2023 · 49
Математичні функції CSS
Зараз у CSS є чотири добре підтримувані математичні функції. Кожна з них надзвичайно корисна у повсякденній роботі. Ці функції CSS можна застосовувати у найнесподіваніших випадках, наприклад, у градієнтах і функціях кольору та у поєднанні зі спеціаль...
Codeguida · 08 вересня 2021 · 21
Виріз в елементах: CSS чи SVG?
Фронтенд-розробники подекуди використовують на сайтах елементи з вирізами, ви мусили натрапляти на них хоча б раз. Для створення такої фігури за допомогою CSS або SVG існує кілька способів. Кожен з них має свої переваги та недоліки, про які ми з вами...
Codeguida · 08 вересня 2021 · 26
CSS-змінні. Стратегія застосування
Динамічні властивості CSS дають можливість створювати креативні рішення, натомість значно ускладнюють структуру коду. Отримати максимум користі можливо, використовуючи стратегію структурування СSS з користувацькими властивостями . Користувацькі СSS-в...
Codeguida · 29 червня 2018 · 534
9 недооцінених можливостей CSS
За більше як 20 років свого існування CSS став стандартом стилізації веб-сторінок. Продовжують виходити нові специфікації (Наприклад, CSS4), що додають нові круті можливості: анімації, трансформації, нові одиниці виміру. В швидкому світі веб-розробки...
Codeguida · 01 жовтня 2021 · 11
Sass за 15 хвилин
Якщо ви пишете велику кількість коду на CSS, препроцесори можуть заощадити вам багато нервів і часу. Використовуючи Sass, Less, Stylus або PostCSS (пост-процесор) робити великі і складні таблиці стилів стане значно простіше та зрозуміліше. Дякуючи та...
Codeguida · 23 вересня 2021 · 104
П'ять способів приховати елементи в CSS
Є кілька способів приховати елемент в CSS. Можна вказати opacity: 0, visability: hidden, display: none або встановити крайні значення для абсолютного позиціонування. Ви коли-небудь задавалися питанням, чому так багато методів приховування елементу, к...
Codeguida · 19 січня 2020 · 715
Коротко про посилання для пропуску та «липкі» хедери
Розповідаємо, як зробити так, щоб основний вміст не перекривався липкими хедерами. Для цього скористаємось властивістю scroll-padding елемента <html>. Чого ми хочемо уникнути: наш заголовок розрізаний навпіл нашим «липким» хедером Що таке посилання...
Codeguida · 14 липня 2021 · 4