Создание стильного контейнера с HTML и CSS: пошаговое руководство

Создание стильного контейнера с HTML и CSS

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

Шаг 1: Основная структура HTML

Начнем с создания основной структуры вашего контейнера. Создайте новый HTML-файл и добавьте следующий код:

<div class="container"> <h1>Добро пожаловать!</h1> <p>Это пример стильного контейнера.</p> </div>

Этот простой код создает контейнер с заголовком и текстом. Теперь мы перейдем к стилизации с помощью CSS.

Шаг 2: Стилизация с помощью CSS

Создайте файл стилей CSS и добавьте следующий код, чтобы сделать ваш контейнер более привлекательным:

.container {
    width: 80%;
    max-width: 600px;
    margin: 20px auto;
    padding: 20px;
    background-color: