Загрузка данных


<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Моё хобби — CSS версия</title>
  <!-- Подключаем внешний файл стилей -->
  <link rel="stylesheet" href="style.css">
</head>
<body>

  <!-- Добавлен id="top-heading" -->
  <h1 id="top-heading">Моё хобби</h1>

  <h2>Как я начал</h2>
  <p>
    Ещё в школе я увлёкся <strong class="accent">фотографией</strong> — сначала снимал на телефон,
    потом купил первую зеркальную камеру. Мне нравилось ловить
    <em>мимолётные моменты</em> и замечать то, что другие пропускают.
    Постепенно это превратилось в настоящее увлечение, а не просто в развлечение.
  </p>

  <h2>Что мне это даёт</h2>
  <p>
    Фотография учит <strong class="accent">внимательности</strong> и терпению: хороший кадр часто
    требует долгого ожидания правильного света. Кроме того, это отличный способ
    <em>отключиться от суеты</em> и побыть наедине с собой. Каждая удачная
    фотография — маленькая победа и повод двигаться дальше.
  </p>

  <h2>Мои планы</h2>
  <p>
    В ближайшее время я хочу освоить <strong class="accent">ночную съёмку</strong> и попробовать
    себя в жанре стрит-фотографии. Мечтаю собрать небольшую серию работ
    <em>о родном городе</em> и распечатать её в фотокнигу. Верю, что регулярная
    практика поможет мне выйти на новый уровень.
  </p>

  <h2>Что мне нравится в этом хобби</h2>
  <ul>
    <li>Возможность замечать красоту в обычных вещах</li>
    <li>Творческая свобода и отсутствие строгих правил</li>
    <li>Общение с другими фотографами</li>
    <li>Путешествия ради новых кадров</li>
    <li>Постоянное развитие и обучение</li>
  </ul>

  <h2>Мой план на месяц</h2>
  <ol>
    <li>Снимать по 10 фотографий каждый день</li>
    <li>Пройти онлайн-курс по обработке в Lightroom</li>
    <li>Сделать фотосессию на закате в центре города</li>
    <li>Отобрать лучшие 15 снимков для портфолио</li>
  </ol>

</body>
</html>


/* Задание 4: Стили для тега body */
body {
  color: #2b2b2b;
  font-family: Arial, sans-serif;
  background-color: #faf8f2;
  /* Добавим отступы, чтобы текст не прилипал к краям экрана (по желанию) */
  padding: 20px; 
  max-width: 800px;
  margin: 0 auto;
}

/* Задание 5: Класс для выделенных слов */
.accent {
  color: #b3541e;
  font-weight: bold;
}

/* Задание 6: Стилизация заголовка через ID */
#top-heading {
  color: #333366;
  font-size: 32px;
}

/* Задание 7: Селектор потомка (пункты списков внутри ul) */
ul li {
  list-style-type: square; /* Изменяем маркер на квадратный */
  line-height: 1.6;        /* Увеличиваем межстрочный интервал */
}