- •Лекция 7
- •Основные теги HTML
- •Фреймы
- •Текстовые блоки
- •Форматирование текста
- •Форматирование текста
- •Списки
- •Список определений
- •Изображения
- •Гиперссылка
- •Таблицы
- •XHTML
- •Правила оформления XHTML
- •Правила оформления XHTML
- •Правила оформления XHTML
- •Пространства имен в XHTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Различия XHTML и HTML
- •Преимущества XHTML
Лекция 7
XHTML
Основные теги HTML
<html> - корневой тег HTML
<head> - раздел заголовка HTML
<title> - заголовок html
<body> - «тело» html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Заголовок страницы</title> </head>
<body>
. . .
</body>
</html>
Фреймы
Фрейм — один из нескольких документов внутри одного окна браузера.
<frameset>...</frameset>
rows, cols — ширины и высоты фреймов (напр: cols='100,*')
<frame .../>
src — URL документа фрейма
name — имя фрейма
scrolling (yes или no) — признак возможности скроллирования
noresize — признак возможности изменения размера.
<frameset rows="80,*" cols="*">
<frame src="top.html" name="topFrame" scrolling="no" noresize="noresize">
<frameset cols="80,*">
<frame src="left.html" name="leftFrame" scrolling="no" noresize>
<frame src="main.html" name="mainFrame">
</frameset>
</frameset>
Текстовые блоки
<h1> … </h1>, <h2> … </h2>, … ,<h6> … </h6>
— заголовки 1, 2, … 6 уровня.
<p>...</p> - новый абзац
<br/> - перевод строки
<hr/> - горизонтальная линия
<blockquote>...</blockquote> - цитата
<pre>...</pre> - преформатированный текст
<div>...</div> - блок текста
<span>...</span> - стока
Форматирование текста
<em>...</em> - логическое ударение (обычно курсив)
<strong>...</strong> - усиленное логическое ударение (обычно
жирный шрифт)
<i>...</i> - курсив
<b>...</b> - жирный шрифт
<u>...</u> - подчеркивание
<s>...</s>, <strike>...</strike> - зачеркивание
<big>...</big> - увеличение шрифта
<small>...</small> - уменьшение шрифта
<blink>...</blink> - мигающий текст
<marquee>...</marquee> - сдвигающийся текст
<sub>...</sub> - подстрочный текст
<sup>...</sup> - надстрочный текст
Форматирование текста
<font …>...</font>
color — цвет текста в форме #rrggbb
face — название шрифта
size — размер шрифта
В виде абсолютного логического значения (1..7), стандартный размер — 3
В виде относительного значения (+размер или -размер), например size='+1' или size='-2'
Списки
<ul>...</ul> - ненумерованный список
<ol>...</ol> - нумерованный список
<li> - элемент списка
Пример:
<ul>
<li>первый элемент</li> <li>второй элемент</li> <li>третий элемент</li>
</ul>
Список определений
<dl>...</dl> - список определений
<dt>...</dt> - заголовок определения
<dd>...</dd> - текст определения <DL>
<DT> Кошка </DT> <DD> мяукающее домашнее животное </DD>
<DT> Кот </DT> <DD> муж кошки </DD>
<DT> Крокодил </DT> <DD> большой африканский зверь с острыми зубами </DD>
</DL>
Изображения
<img .../>
src — URL изображения
alt — альтернативное имя
title — краткое описание изображения
width, height — ширина и высота (в пикселях или процентах)
align — парамеры расположения картинки (top, middle, bottom, left, right)
vspace, hspace — пустое пространство вокруг изображения