Вы находитесь на странице: 1из 2

<!

DOCTYPE html>
<html lang="ru">

<head>
<link rel="stylesheet" href="style.css">
<meta charset="UTF-8">
<title>CSS</title>
</head>

<body>
<main>
<header>
<h1>
Что такое CSS и зачем он нужен?
</h1>
</header>
<article>
<img src="https://itproger.com/img/courses/1476977488.jpg">
<h2 class="vip">
Что это такое?
</h2>
<p>
Каскадные таблицы стилей <i>(Cascading Style Sheets = CSS)</i> —
это язык, который отвечает за визуальное представление документов
пользователю.<br><br>
Под документом мы будем понимать набор информации о структуре
страницы, описываемый языком разметки.<br><br>
А представление документа пользователю, в свою очередь, означает
его преобразование в удобную для восприятия форму. Браузеры, такие как Firefox,
Chrome или Internet Explorer, были созданы для визуального отображения документов,
например, на экране компьютера, проекторе или вывода через принтер.
</p>
</article>
<article>
<img src="https://idg.net.ua/blog/wp-content/uploads/chapter-02-css-
syntax.png">
<header>
<h2 class="vip">
Зачем нужен CSS
</h2>
</header>
<p>
CSS используется для определения стилей ваших документов, в том
числе дизайна, верстки и вариаций макета для различных устройств и размеров
экрана.<br><br>
Используя CSS, вы храните информацию о стилях в общих файлах,
которые доступны всем страницам. Например, когда документы ссылаются на те таблицы
стилей, которые определяют цвет заголовков h2, вы можете применить стиль для тегов
заголовков h2 на глобальном уровне путем изменения одного атрибута CSS.<br><br>
Когда пользователь открывает веб-страницу, браузер загружает
информацию стиля вместе с содержанием страницы.<br><br>
Когда пользователь открывает веб-страницу в режиме печати, вы
можете предоставить различную информацию о стилях которая сделает страницу более
лёгкой для чтения.
</p>
</article>
<p class="mus">Обучение:</p>
<iframe width="560" height="315"
src="https://www.youtube.com/embed/iPV5GKeHyV4?controls=0&amp;start=5152"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media;
gyroscope; picture-in-picture" allowfullscreen></iframe>
</main>
<footer>
<p class="mus">Музыка:</p>
<iframe frameborder="0" style="border:none;width:100%;height:70px;"
width="100%" height="70"
src="https://music.yandex.ru/iframe/#track/69865260/11747266">Слушайте <a
href='https://music.yandex.ru/album/11747266/track/69865260'>Элегантный, Echos</a>
— <a href='https://music.yandex.ru/artist/9784482'>Музыка для программирования</a>
на Яндекс.Музыке</iframe>
<p><i class="me">Автор: Озеров Иван<br>
Да это был я</i></p>
</footer>
</body>

</html>