CSS Упражнения

Отточите свои навыки работы с каскадными таблицами стилей (CSS) с помощью серии практических упражнений. Эта подборка практических задач разработана для проверки и улучшения вашего понимания основных концепций CSS. Каждое упражнение представляет реальную проблему стилизации, позволяя вам применить свои знания селекторов, свойств, моделей макета, таких как Flexbox и Grid, а также принципов адаптивного дизайна. Выполняйте эти задачи по кодированию, чтобы обрести уверенность и мастерство в стилизации веб-страниц.

Ваше первое практическое занятие по CSS

Ваше первое практическое занятие по CSS

Привет! Добро пожаловать в LabEx! В этом первом практическом занятии вы научитесь создавать классическую программу 'Hello, World!' на CSS.
LabCSS
3D Вращающийся куб

3D Вращающийся куб

В этой лабораторной работе мы создадим 3D вращающийся куб с использованием HTML и CSS. Этот куб будет иметь яркие грани и будет вращаться бесконечно, создавая визуально привлекательный эффект. Мы проведем вас по каждому этапу процесса, чтобы помочь вам создать этот проект с нуля.
LabCSS
Анимации и переходы

Анимации и переходы

В оживленном мире 'Дома для питомцев', виртуальном святилище для любителей животных, Тейлор, креативный веб-дизайнер, отправляется в путь, чтобы придать жизнь веб-сайту.
LabCSS
Основы CSS и селекторы

Основы CSS и селекторы

В этом практическом занятии вы попытаетесь стать веб - разработчиком, которому поручено создать стильный веб - сайт для услуги по уходу за питомцами, используя основные техники и селекторы CSS.
LabCSS
CSS Box Model и Отступы

CSS Box Model и Отступы

В оживленном цифровом мире сайта 'Дом для питомцев', который посвящен предоставлению высококачественных услуг по уходу за питомцами, главный герой, Джордан, талантливый веб-разработчик, имеет задачу улучшить макет и дизайн сайта.
LabCSS
Респонсивный сайт 'Дом для питомцев' с использованием Flexbox

Респонсивный сайт 'Дом для питомцев' с использованием Flexbox

В оживленном городе Петвилль веб - разработчик Джордан получил задачу переделать сайт 'Дом для питомцев'.
LabCSS
Показка услуг по уходу за питомцами с использованием CSS Grid

Показка услуг по уходу за питомцами с использованием CSS Grid

В 'Доме для питомцев', виртуальном мире для любителей животных, веб-разработчик Алекс предпринимает попытку обновить показку их услуг с использованием CSS Grid.
LabCSS
Улучшение персонального финансового трекера

Улучшение персонального финансового трекера

В этой лаборатории путь Алексея в разработке персонального финансового трекера входит в более продвинутую стадию, с акцентом на повышение интерактивности приложения с использованием сложных техник обработки событий. Сценарий разворачивается на头脑-сторонг-сессии в технологическом стартапе, где Алекс предлагает добавить функцию перетаскивания для переупорядочивания финансовых записей. Эта амбициозная цель направлена на то, чтобы предоставить пользователям интуитивный способ организации своих записей, отражая динамичность управления личными финансами. Для достижения этого Алекс должен изучить продвинутые DOM-события и манипулировать элементами таким образом, чтобы они были как визуально привлекательными, так и удобными для пользователя.
LabCSS
Блочная модель CSS

Блочная модель CSS

В этой лабораторной работе вы изучите основы блочной модели CSS, включая содержимое (content), внутренние отступы (padding), границу (border) и внешние отступы (margin), а также как управлять размерами элементов с помощью box-sizing.
LabCSS
Цвета и фоны CSS

Цвета и фоны CSS

В этой лабораторной работе вы научитесь стилизовать элементы веб-страницы, применяя различные свойства CSS для цветов и фонов, включая установку цветов, добавление изображений и управление их положением и повторением.
LabCSS
Введение в CSS и подключение стилей

Введение в CSS и подключение стилей

В этой лабораторной работе вы изучите основы CSS, включая создание внешнего файла стилей и его подключение к HTML-документу для изменения шрифта страницы.
LabCSS
Основы CSS-селекторов

Основы CSS-селекторов

В этой лабораторной работе вы изучите основы CSS-селекторов, включая селекторы элементов, классов, ID, группировки и потомков для стилизации HTML-элементов.
LabCSS
Стилизация текста в CSS

Стилизация текста в CSS

В этой лабораторной работе вы изучите основы стилизации текста в CSS, включая настройку цвета текста, размера шрифта, насыщенности шрифта, выравнивания и межстрочного интервала.
LabCSS