Записи в категорії: CSS

В цій категорії ми будемо публікувати корисні матеріали. що стосуються сучасних можливостей мови програмування CSS. Вся теоретична частина в постах буде підкріплена практичними прикладами.

Як створити прості кнопки за допомогою CSS3

Як створити прості кнопки за допомогою CSS3

У сьогоднішньому уроці ми на практиці зробимо кілька класних, але простих, кнопок за допомогою CSS3 стилів. Ви можете їх використовувати для красивого оформлення користувацького інтерфейсу своїх проек ...
Приклад використання функції calc() для зміни розміру шрифту в CSS

Приклад використання функції calc() для зміни розміру шрифту в CSS

Раніше ми робили короткий огляд функції calc() в CSS. Сьогодні ми хочемо розглянути невеликий практичний приклад, який дасть рішення для плавного масштабування розміру шрифта в залежності від розміру ...
Ознайомлення з функцією calc() в CSS

Ознайомлення з функцією calc() в CSS

Функція calc() в CSS – це простий спосіб виконати прості математичні дії прямо в CSS стилях без використання, наприклад, мови програмування PHP. Функція вміє працювати з чотирма простими математичними ...
Основні види 3D-трансформацій в CSS

Основні види 3D-трансформацій в CSS

Коли з’явилися CSS-трансформації, з елементами стало можливим проводити різні перетворення: їх можна зміщувати, повертати, нахиляти, здавлювати і розтягувати. А за допомогою 3D-перетворень в CSS ...
Огляд властивості line-height у CSS-стилях

Огляд властивості line-height у CSS-стилях

За допомогою властивості line-height в CSS встановлюється величина простору між рядками. У блокових елементах властивість впливає на мінімальну висоту рядків усередині елемента. Для вбудованих елемент ...
Розбираємо властивість display в CSS

Розбираємо властивість display в CSS

Властивість display є однією з найбільш важливих властивостей CSS, які використовуються верстальниками для побудови макету. Найпопулярнішими значеннями цієї властивості є block, inline та none. Значен ...
Розширені селектори CSS, про які потрібно знати

Розширені селектори CSS, про які потрібно знати

За допомогою CSS можна створювати дійсно приголомшливі сайти. А правильний підхід до використання стилів дозволяє реалізувати практично будь-які ідеї у веб-дизайні. І одним з головних моментів тут є е ...
Використання різних властивостей розміру шрифту в CSS-стилях

Використання різних властивостей розміру шрифту в CSS-стилях

В CSS є маса різних властивостей, які дозволяють впливати на розмір шрифту. Крім цього розмаїття, у даних властивостей фактична величина їх значення часто обчислюється браузерами по-різному. Все це об ...
Прискорюємо свій CSS

Прискорюємо свій CSS

Ви коли-небудь думали про розмір файлів CSS-стилів на своєму сайті? Адже якщо ці файли мають велику вагу, це негативно позначиться на завантаженні (відображенні) сторінки. Хоча CSS-файли сайту в основ ...
Псевдокласи в CSS – мінімальний набір знань

Псевдокласи в CSS – мінімальний набір знань

Псевдоклас в CSS стилях – це ключове слово, яке при додаванні до селектора визначає його особливий стан. Наприклад, псевдоклас :focus дозволяє застосовувати особливі CSS-стилі для елементів, які знахо ...
Використання Flexbox в CSS3 для адаптивного дизайну

Використання Flexbox в CSS3 для адаптивного дизайну

У цій статті ми хочемо більш детально зупинитися на використанні flexbox в CSS3, в якості одного з просунутих способів досягнення адаптивності на сайті. При створенні CSS складність макетів була не та ...
Основні способи вертикального вирівнювання елементів в CSS

Основні способи вертикального вирівнювання елементів в CSS

Одна з найпопулярніших проблем, з якими стикаються веб-дизайнери – це вертикальне центрування елементів в CSS і правильне їх відображення на девайсах з різними розмірами екрану. І складність не в тому ...
Основні трюки CSS стилів для вебмайстрів початківців

Основні трюки CSS стилів для вебмайстрів початківців

Бувають ситуації при веб-розробці, коли потрібні швидкі рішення і найбільш простим виходом буде використання легких, але ефективних CSS-трюків. Деякі трюки настільки прості, що веб-дизайнери про них і ...
Скошені краї блоків за допомогою CSS-масок і трансформацій

Скошені краї блоків за допомогою CSS-масок і трансформацій

За допомогою вузлуватих, скошених країв у різних html-елементів (картинок, блоків, цілих секцій) можна надати унікальний вигляд будь-який веб-сторінці. У цій статті ми розглянемо практичні приклади то ...
Ознайомлення із CSS-анімацією (animation)

Ознайомлення із CSS-анімацією (animation)

У минулій статті ми робили короткий огляд CSS-переходів, а в цьому пості проведемо ознайомлювальний рейд по корисним, як я сподіваюся, питанням CSS-анімації. Ці дві нові властивості в CSS3 дозволяють ...