Курс "WEB-master" модуль WEB-1 - занятие 2

Выбор занятия

Выберите текущее занятие

Все материалы предоставлены в образовательных целях. Для пополнения базы материалов или цитат присылайте свои тексты на эл. почту (внизу страницы).

HTML

Структура HTML документа

HTML-документ заключается в теги <html> и </html>. Между этими тегами располагаются два раздела: раздел заголовка ( элемент head ) и раздел тела документа ( элемент body для простого документа либо элемент frameset, задающий набор кадров ). Все указанные элементы имеют начальный и конечный тег.

Секция заголовка содержит описание параметров, используемых при отображении документа, но не отражающихся непосредственно в окне браузера. Секция тела документа содержит текст, предназначенный для отображения браузером и элементы, указывающие на способ форматирования текста, определяющие графическое оформление документа, задающие параметры гиперссылок и так далее.

Формально, согласно спецификации HTML 4+, первым в документе должен указываться элемент doctype, сообщающий браузеру об использованной версии HTML ( а версии, как уже говорилось, различаются наборами допустимых элементов и правилами их объявления ). В элементе doctype указывается также адрес, с которого браузер может загрузить определение типа документа - Dtd (Document Type Definition). На практике же этот элемент зачастую опускают без ущерба для отображения документа.

<!doctype html>
<html>
	<head>
		<title>HTML структура документа</title>
	</head>
	<body>
		<h3>Мой первый заголовок</h3>
		<p>Мой первый параграф</p>
		<p>Мой второй параграф</p>
	</body>
</html>	

Тэги HTML

Рассмотрим HTML теги, определяющие структуру страницы

  • html – обязательные, определяют HTML документ.
  • head – определяют секцию со служебной информацией, содержат инструкции для поисковиков, для браузеров, скрипты.
  • title – определяют основной заголовок web - страницы.
  • body – обязательные, определяют видимую часть документа.
  • h3 – определяют заголовок 3-го уровня.
  • p – определяют параграф

Текст

В настоящее время, текст в HTML является основным способом подачи информации. Подавляющее большинство сайтов в Интернете состоят именно из текстового контента. Это означает, что создать свой сайт можно при умении, как минимум, читать, а как максимум — писать.

Теги, форматирующие HTML текст:

  • strong - жирный HTML текст (жирный шрифт).
  • b - жирный HTML текст (жирный шрифт).
  • code - моноширинный HTML текст (моноширинный шрифт).
  • big - HTML текст, размер больше обычного (крупный шрифт).
  • small - HTML текст, размер меньше обычного (мелкий шрифт).
  • em - наклонный HTML текст (наклонный шрифт).
  • i - наклонный HTML текст (наклонный шрифт).
  • ins - подчеркнутый HTML текст (подчеркнутый шрифт).
  • del - зачеркнутый HTML текст (зачеркнутый шрифт).
  • sub - HTML текст (шрифт) в нижнем индексе.
  • sup - HTML текст (шрифт) в верхнем индексе.

Заголовки

<!doctype html>
<html>
	<head>
		<title>html заголовки</title>
	</head>
	<body>
		<h1>Заголовок H1</h1>
		<h2>Заголовок H2</h2>
		<h3>Заголовок H3</h3>
		<h4>Заголовок H4</h4>
		<h5>Заголовок H5</h5>
		<h6>Заголовок H6</h6>
	</body>
</html>	

Списки.

Маркированный список

  • ul – определяют маркированный HTML список.
  • li – определяют элементы (пункты) маркированного HTML списка.

<!doctype html>
<html>
	<head>
		<title>Маркированный HTML список</title>
	</head>
	<body>
		<ul>
			<li>Sony</li>
			<li>Asus</li>
			<li>Dell</li>
		</ul>
	</body>
</html>	

HTML картинка - фон определяется с помощью атрибута background-image и картинки.