Основи CSS

Зміст курсу

Основи CSS

Основи CSS

1. Вступ до CSS

Що таке CSS?Поєднання HTML і CSS Селектори для Стилізації HTML Елементів Челендж: Додайте Свої Перші Стилі Челендж: Додайте Стилі за Допомогою Імені Класу Псевдокласи Дій Користувача Челендж: Псевдокласи Дій Користувача Кольори Тексту Ефективна Робота з CSS Челендж: Змінні в CSS

2. CSS для Тексту

Стилізація Тексту Форматування Тексту Челлендж: Форматування Тексту Додавання Користувацьких Шрифтів до Веб-сторінки Властивості Шрифту Челендж: Шрифти

3. Бокс Модель та Відстань між Елементами

Бокс Модель Бокс Сайзінг Додавання Простору Елементам Челендж: Бокс-сайзінг Структурні та Функціональні Псевдокласи Челендж: Структурні Псевдокласи Типи Елементів Робота з Блочними Елементами Робота з Інлайн Елементами Челендж: Спрогнозуйте Макет Сторінки

4. Флексбокс

Що таке Flexbox?Flex Напрямок Вирівнювання Вмісту по Горизонталі Вирівнювання Елементів по Вертикалі Властивості Flex-Елементів Челендж: Flexbox Челендж: Робота з Flexbox

5. Декоративні Ефекти

Колір Фону Фонове Зображення Робота з Зображеннями Декоративні Псевдо-Елементи Тіні Челендж: Декоративні Ефекти Подальші Кроки

Вирівнювання Вмісту по Горизонталі

The justify-content property is instrumental in determining the position of flex items along the main axis. Its default value is flex-start.

css

flex-start

Значення за замовчуванням, яке змушує всі елементи розташовуватися на початку головної осі.

flex-start

Default value, which makes all the items be at the start of the main axis.

index.html

index.css

flex-end

All items are at the axis end.

index.html

index.css

center

All items are in the center.

index.html

index.css

space-around

It distributes all the items evenly along the main axis with a bit of space left at either end.

index.html

index.css

space-between

It is very similar to space-around except that it doesn't leave any space at the axis on both ends.

index.html

index.css

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 4. Розділ 3

some-alt