css
(130)
Різні способи написання CSS у React
Ми всі знайомі зі стандартним способом приєднання таблиці стилів у <head> HTML-документа, чи не так? Це лише один з декількох способів написання CSS. Але як це виглядає, якщо ми хочемо створити стиль...
04 серпня 2023
·
0
· 254
·
Alex
9 порад щодо оптимізації зображень для прискорення вашого сайту
У цій статті ми розглянемо ефективні методи оптимізації зображень, які значно покращать продуктивність вашого застосунку. Почнемо з самого початку!
1. Формати зображень
Вибір правильного формату зобра...
31 липня 2023
·
1
· 59
·
Alex
Адаптивне меню з допомогою CSS3 та jQuery
В цьому уроці ми створимо адаптивне меню за допомогою CSS3 і JQuery. Ось як це виглядатиме (перейдіть на Codepen та пограйтеся з шириною сторінки):
{full-post-img}
HTML
Ми обертаємо все в nav елемент...
27 грудня 2021
·
0
· 38
·
Codeguida
Об'єктно-орієнтований CSS
Це звучить дуже дивно, але ідеї ООП можна реалізувати в CSS, зробивши його
більш зручним та швидким.
Що таке OOCSS?
Коли Ви чуєте "об'єктно-орієнтований CSS", можна подумати, що це якийсь новий
CSS-пр...
20 грудня 2021
·
0
· 16
·
Codeguida
Створюємо власний блог з допомогою Parse.js, частина 6: Редагування
####Попередні уроки:
Створюємо власний блог з допомогою Parse.js
Створюємо власний блог з допомогою Parse.js: Працюємо з даними
Створюємо власний блог з допомогою Parse.js: Авторизація користува...
14 грудня 2021
·
0
· 8
·
Codeguida
Front-end воїн - Scroll Progress
Сьогодні ми розглянемо кілька методів демонстрації прогресу прокрутки веб-
сторінки. Ця техніка використовується на багатьох сайтах, і не дарма; вона
забезпечує контекстуальне розуміння кількості інфо...
13 грудня 2021
·
0
· 44
·
Codeguida
CSS фото-ефекти. Частина перша: Вінтаж
Ефект ерозії
Цей ефект ми зазвичай бачимо у фільтрах, які надають фото вінтажний стиль. Тут найтемніші кольори висвітлюються, загублюються маленькі деталі у тінях і понижується контраст.
{full-post-i...
08 грудня 2021
·
0
· 11
·
Codeguida
@-правила CSS
Переклад статті Джеффа Грема на CSS-Tricks від 12 травня 2015.
@-правило - директива, яка дозволяє створювати в CSS інструкції для зміни відображення або поведінки елементів сторінки. Кожен оператор п...
25 листопада 2021
·
1
· 40
·
Codeguida
Чого можна досягнути з допомогою CSS змінних і неможливо зробити використовуючи препроцесори
Зараз дуже популярним є використання препроцесорів для CSS: Less, Saas,
Stylus. Основною причиною широкого застосування цих інструментів є можливість
роботи зі змінними. Проте, після компіляції в звич...
23 листопада 2021
·
0
· 13
·
Codeguida
Тренди веб-розробки в 2017 році
Інтернет - це майбутнє! Саме так казали люди десятки років тому, і вони не помилилися - тепер інтернет це невід'ємна частина життя багатьох людей. Ваш сусід, колега, випадковий перехожий в метро - всі...
20 листопада 2021
·
0
· 3
·
Codeguida
Основи Webpack: Частина 2
У першій частині туторіалу ми дізналися, як створити Webpack проект, а також як використовувати лоадери для обробки нашого JavaScript коду. Але найголовніша властивість Webpack полягає в його здатност...
12 листопада 2021
·
0
· 110
·
Codeguida
20 порад для написання сучасного CSS
В цьому пості ми поділимося колекцією з 20 порад та кращих практик, що зроблять ваш CSS набагато кращим
1. Остерігайтеся Margin Collapse
На відміну від інших властивостей, вертикальні відступи (margin...
11 листопада 2021
·
0
· 89
·
Codeguida
Створюємо власний блог з допомогою Parse.js, частина 4: Додаємо новий блог
Попередні уроки:
Створюємо власний блог з допомогою Parse.js;
Створюємо власний блог з допомогою Parse.js: Працюємо з даними;
Створюємо власний блог з допомогою Parse.js: Авторизація користувачі...
08 листопада 2021
·
0
· 6
·
Codeguida
Реліз Bootstrap 4 alpha!
Це вільний переклад поста з The Official Bootstrap Blog.
Сьогодні особливий день для Bootstrap. Не тільки через те, що сьогодні наш четвертий День народження, а й через те, що після року розробки ми...
04 листопада 2021
·
0
· 4
·
Codeguida
Як не гаяти час на завантаження невидимого контенту
Браузер не розрізняє невидимий вміст від видимого
Зазвичай не весь вміст вебсторінки поміщається на одному екрані.
Коли сторінка відкривається, браузер обчислює розміри та позиції всіх DOM-елементів н...
17 жовтня 2021
·
2
· 129
·
Codeguida
Що цікавого можна зробити з checkbox
Checkbox дозволяють вибрати більше одного варіанта з запропонованих в формі. Розумно поєднуючи їх з CSS, можна отримати дивовижні речі. Ця стаття покликана продемонструвати деякі з креативних речей, щ...
16 жовтня 2021
·
0
· 349
·
Codeguida
Динамічні лого з допомогою CSS
Анімований логотип використовується, щоб більш широко описати сферу
діяльності, а ще це просто гарно виглядає!
Можна зробити це з допомогою анімування SVG, але в цьому прикладі ми
використаємо CSS. Сл...
15 жовтня 2021
·
1
· 17
·
Codeguida
9 недооцінених можливостей CSS
За більше як 20 років свого існування CSS став стандартом стилізації веб-сторінок. Продовжують виходити нові специфікації (Наприклад, CSS4), що додають нові круті можливості: анімації, трансформації,...
01 жовтня 2021
·
1
· 15
·
Codeguida
Sass за 15 хвилин
Якщо ви пишете велику кількість коду на CSS, препроцесори можуть заощадити вам багато нервів і часу. Використовуючи Sass, Less, Stylus або PostCSS (пост-процесор) робити великі і складні таблиці стилі...
23 вересня 2021
·
1
· 157
·
Codeguida
Лінтинг у CSS: корисні та маловідомі можливості Stylelint
Писати якісний CSS — це аж ніяк не просте завдання. Схоже, що CSS дратує людей більше, ніж інші технології, тому дивно, що лінтери на кшталт Stylelint обговорюються рідко. Виявлення й виправлення поми...
21 вересня 2021
·
1
· 110
·
1
·
Codeguida
Ресурси, що блокують рендеринг: як правильно їх позбутися
Ця стаття буде корисною, якщо Lighthouse коли-небудь казав вам «прибрати ресурси блокування рендерингу» (якщо не казав, то все одно можете дізнатись, як цього уникнути).
Ресурси блокування рендерингу...
21 вересня 2021
·
2
· 280
·
Codeguida
Основи роботи з адаптивним текстом
Не секрет, що для того щоб текст прочитало якнайбільше людей, він теж повинен бути адаптивним. Його розмір повинен залежати від розміру екрану. Зазвичай для цього задають розміри в rem. І тоді вже бра...
19 вересня 2021
·
0
· 45
·
Codeguida
Математичні функції CSS
Зараз у CSS є чотири добре підтримувані математичні функції. Кожна з них надзвичайно корисна у повсякденній роботі. Ці функції CSS можна застосовувати у найнесподіваніших випадках, наприклад, у градіє...
08 вересня 2021
·
1
· 32
·
Codeguida
Виріз в елементах: CSS чи SVG?
Фронтенд-розробники подекуди використовують на сайтах елементи з вирізами, ви мусили натрапляти на них хоча б раз. Для створення такої фігури за допомогою CSS або SVG існує кілька способів. Кожен з ни...
08 вересня 2021
·
1
· 68
·
Codeguida