52 lines
3.7 KiB
HTML
52 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru-en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Пидис страничка</title>
|
||
<link rel='stylesheet' type='text/css' media='screen' href="style.css"/>
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<!--Header-->
|
||
<div class="header" id="header">
|
||
<ul class="nav">
|
||
<li><a href="#home">Главная</a></li>
|
||
<li><a href="#info">Информация</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!--Title-->
|
||
<h1 id="home">Страничка для ПиДИС</h1>
|
||
|
||
<!--Text-->
|
||
<div class="container">
|
||
<h2>Как создать простую страницу на HTML</h2>
|
||
<ol>
|
||
<p><li>Откройте ваш любимый текстовый редактор и создайте новый файл с расширением .html.</p></li>
|
||
<p><li>Напишите в начале документа <code><!DOCTYPE html></code>, а затем – первый тег <code><html></code>.</p></li>
|
||
<p><li>Внутри тега <code><html></code> добавьте следующие теги в порядке: <code><head></code>, <code><title></code>, <code></title></code>, и <code></head></code>.</p></li>
|
||
<p><li>Внутри напишите название вашего сайта внутри тега <code><title></code>.</p></li>
|
||
<p><li>Далее, создайте тег <code><body></code> и начинайте добавлять контент к нему.</p></li>
|
||
<p><li>Чтобы структурировать страницу более организованно, используйте теги <code><div></code>, и <code><span></code> для группировки элементов, таких как заголовки, параграфы и списки.</p></li>
|
||
<p><li>Для заголовочных тегов используйте от <code><h1></code> до <code><h6></code>, в зависимости от их важности. Используйте тег <code><p></code> для создания абзацев текста.</p></li>
|
||
<p><li>Добавьте ссылки между страницами с помощью тега <code><a></code> вместе со свойством <code>href</code>, указывающим на другие файлы.</p></li>
|
||
<p><li>Создавайте списки с помощью <code><ol></code> (нумерованный) или <code><ul></code> (ненумерованный) и элементы списка через <code><li></code> (независимо от типа списка).</p></li>
|
||
<p><li>Для включения изображений используйте тег <code><img></code> с атрибутом <code>src</code>, указывающим путь к файлу изображения.</p></li>
|
||
<p><li>Для встраивания видео используйте тег <code><video></code> с атрибутом <code>src</code>, указывающим на видеофайл, и <code>controls</code> для того, чтобы пользователи могли проигрывать и ставить видео на паузу.</p></li>
|
||
<p><li>Всегда закрывайте открывающие теги соответствующими закрывающими тегами.</p></li>
|
||
</ol>
|
||
<p>Удачи!</p>
|
||
</div>
|
||
|
||
<!--Footer-->
|
||
<div><footer id="info">
|
||
<p class="nav"><a href="#header">Наверх</a></p>
|
||
<p><!--©--> 10.2023, Никитин Антон</p>
|
||
<p><a href="http://kormcraft.ddns.net:3000/Antone/Pidis_website">gitea</p>
|
||
</footer></div>
|
||
|
||
</body>
|
||
</html>
|