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

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>Задание 8</title>
  <style>
    body {
      font-family: Times New Roman, serif;
      background: #fff;
    }

    .frame {
      width: 750px;
      margin: 40px auto;
      padding: 20px;
      border: 2px solid #666;
      background: #dfeee7;
    }

    .title {
      text-align: center;
      font-size: 28px;
      margin-bottom: 25px;
    }

    .red { color: red; }
    .green { color: green; }
    .blue { color: blue; }
    .orange { color: orange; }
    .bold { font-weight: bold; }
    .italic { font-style: italic; }
    .underline { text-decoration: underline; }
    .strike { text-decoration: line-through; }

    p {
      font-size: 22px;
      line-height: 1.6;
      margin: 15px 0;
    }

    .right {
      text-align: right;
    }
  </style>
</head>
<body>
  <div class="frame">
    <div class="title">
      Некоторые <span class="red bold">правила</span> <span class="green bold">ОФОРМЛЕНИЯ</span>
    </div>

    <p>
      <span class="blue" style="font-size: 30px;">Существуют</span>
      принятые в издательском деле правила среды, в которой работают
      <span class="underline">браузеры</span>.
    </p>

    <p class="right">
      Так, заголовок первого уровня <span class="blue">H1</span> выводится
      <br>
      крупным <span class="red bold">жирным</span> шрифтом, <span class="italic">цитаты</span>
    </p>

    <p>
      <span class="bold underline">CITE</span> – курсивом, абзацы <span style="font-family: monospace;">P</span> отделяются
      друг от друга <span class="strike">пустыми строками</span>,
      элементы списка <span style="font-family: monospace;">UL</span> снабжаются маркерами,
      <span class="orange italic">элементы списка OL</span> – номерами.
    </p>
  </div>
</body>
</html>