Создадим страничку «О нас» (about.html) в дополнение к главной странице (index.html). Процесс будет быстрым и простым.
Создание файла и копирование структуры
В той же директории, где находится файл index.html, создадим файл about.html. Для удобства, скопируем содержимое index.html в новый файл. Заменим заголовок (<title>) на «Информация о нас» и сохраним изменения.
Удаление лишнего контента
Удалим содержимое тега <body> в файле about.html, оставив необходимый код. Подключим ранее созданные файлы (шапка, футер, боковая панель).
Добавление контента и стилизация
Добавим блок с информацией, например, с заголовком «О нас». В качестве примера, используем текст-заполнитель Lorem ipsum. Сохраним изменения и обновим страницу в браузере.
В файле style.css (или аналогичном) добавим стили:
/* Стили для страницы "О нас" */
#about-us { /* пример id блока */
width: 80%;
padding: 10px;
background-color: #f0f0f0; /* пример цвета */
}Например, зададим ширину блока 80%, отступы (padding) и фоновый цвет. Корректировка значений (например, ширины) может потребоваться для желаемого результата.
Создана страничка «О нас». Работа с блоками оказалась простой: добавили заголовок, подключили файлы и внесли стили. Результат — функциональная и стильная страница.