Найти в Дзене
nisa

Как написать свою простую HTML-страничку?

Итак сама страница будет иметь расширение html, а в блокноте будет вот в таком виде: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <h1><big><b><p align=center>Бу!Испугались?</p></b></big></h1> <title>test1 </title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> </head> <body> <br> <br> <h2><big><b><p align=center>Здравствуйте!</p></b></big></h2> <br> <br> <h3><big><b><p align=center>Ваша собственная страница</p></b></big></h3><br> <p align=center><font color="FF8C00">Создание HTML-страничек</font></p><br> <br> <br> <p align=right><b>Сделалано</b> <br> просто так </p> <br> <p align=right><b>хммм</b>зачем?<br/> не знаю</p><br> <p align=center>2025</p> <hr> <br><p>рисуночек</p> <pre> <p align=center><font color="483D8B"> (\__/) зайчик</font> <font color="FFD700">(^_^) для</font> <font color="008000"> ("_(" удачи</font></p> </pre> </body> </html> Если вы скопируете это в блокнот и сохранив, затем откроете, то получите ту самую
Оглавление

Коротко о том как написать, пример и немного теории ждут вас в этой статье. Приятного изучения!

Для начала посмотрим на то, что у нас получится.
Для начала посмотрим на то, что у нас получится.

Готовая страница. Пример.

Итак сама страница будет иметь расширение html, а в блокноте будет вот в таком виде:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<h1><big><b><p align=center>Бу!Испугались?</p></b></big></h1>

<title>test1 </title>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

</head>

<body>

<br>

<br>

<h2><big><b><p align=center>Здравствуйте!</p></b></big></h2>

<br>

<br>

<h3><big><b><p align=center>Ваша собственная страница</p></b></big></h3><br>

<p align=center><font color="FF8C00">Создание HTML-страничек</font></p><br>

<br>

<br>

<p align=right><b>Сделалано</b> <br> просто так </p>

<br>

<p align=right><b>хммм</b>зачем?<br/> не знаю</p><br>

<p align=center>2025</p>

<hr>

<br><p>рисуночек</p>

<pre>

<p align=center><font color="483D8B"> (\__/) зайчик</font>

<font color="FFD700">(^_^) для</font>

<font color="008000"> ("_(" удачи</font></p>

</pre>

</body>

</html>

Если вы скопируете это в блокнот и сохранив, затем откроете, то получите ту самую страницу.

А теперь немного теории и что значат теги.

HTML (HyperText Markup Language) означает язык разметки гипертекста. Этот язык был разработан Тимом Бернерсом-Ли в рамках создания проекта распределенной гипертекстовой системы, которую он назвал Всемирная паутина. HTML предназначен для описания гипертекстовых документов, публикуемых в World Wide Web. Существует несколько версий HTML. Стандарт языка непрерывно обновляется и дополняется. Занимается этим особая комиссия по стандартам - консорциум по WWW: W3C (World Wide Web Consortium).

Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, обязан начинаться со строки декларации версии HTML <!DOCTYPE>, например:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Эта строка поможет браузеру определить, как правильно интерпретировать данный документ. В данном случае мы говорим браузеру, что HTML соответствует международной спецификации версии 4.01.

В целом HTML-документ состоит из начала, заголовка и тела.

Так же при выборе цвета символов вам понадобится таблица цветов, а также есть стандартные шрифты:

  • Times New Roman
  • Arial Narrow
  • Arial
  • Courier New
  • Tahoma
  • Comic Sans MS
  • Verdana

Теги.

Обязательным для многих тего является конструкция из открывающего и закрывающего тега.

  • <br> перенос строки
  • <b>Бу!Испугались?/b> жирный шрифт
  • <i> </i> курсив
  • <!--текст коментария к строке--->
  • В теге-контейнере <h1> отображается стилем заголовка первого уровня (обычно жирным шрифтом большего размера). Заголовок кратко описывает содержимое фрагмента страницы, которому он предшествует. Заголовки отображаются жирным шрифтом. Заголовки имеют 6 уровней с 1-го по 6-й и различаются только размером шрифта.
  • Тег <p> означает, что начинается новый параграф, тег </p> означает конец параграфа.
  • <hr> создаёт линию горизонтальную
  • Для выделения абзаца служит тег-контейнер <p>. В теге можно указать способ выравнивания текста
  • <big> Текст внутри тега-контейнера будет отображаться больше на 1 пункт, чем основной шрифт
  • Тег-контейнер <font> позволяет изменить размер, цвет и тип шрифта
После прочтения этой статьи советую, всё же полистать уроки по HTML, если хотите узнать больше , получить и отработать подобный навык.