- •Основные понятия
- •Создание html-документа
- •Работа с текстом
- •Любое количество пробелов идущих подряд, на веб-странице отображается как один
- •Нет расстановки переносов в тексте
- •Текст занимает ширину окна браузера
- •То, что выделено цветом, на занятие не изучалось. Сохраните пока себе это для справки. К этому типу форматирования текста мы еще вернемся, когда будем изучать продвижение. Списки
- •Маркированный список
- •Нумерованный список
- •Открытие ссылки в новом окне
- •Изображения
- •Атрибуты colspan и rowspan позволяют объединять ячейки, таким образом, создаются сложные таблицы.
Нумерованный список
Нумерованные списки представляют собой набор элементов с их порядковыми номерами.
<html>
<head>
<title>нумерованный список </title>
</head>
<body>
Список элементов:
<ol>
<li> элемент 1 </li>
<li> элемент 2 </li>
<li> …………. </li>
<li> элемент n </li>
</ol>
</body>
</html>
Вид и тип нумерации зависит от параметров тега <OL>, который и применяется для создания списка. В качестве нумерующих элементов могут выступать следующие значения:
арабские цифры (1, 2, 3, ...);
прописные латинские буквы (A, B, C, ...);
строчные латинские буквы (a, b, c, ...);
римские цифры в верхнем регистре (I, II, III, ...);
римские цифры в нижнем регистре (i, ii, iii, ...).
Для указания типа нумерованного списка применяется параметр type тега <OL>.
Тип списка |
Код HTML |
Пример |
Нумерованный список с арабскими цифрами |
<ol type="1"> <li>...</li> </ol> |
1. Элемент 1 2. Элемент 2 3. Элемент 3 |
Нумерованный список с прописными буквами латинского алфавита |
<ol type="A"> <li>...</li> </ol> |
A. Элемент 1 B. Элемент 2 C. Элемент 3 |
Нумерованный список со строчными буквами латинского алфавита |
<ol type="a"> <li>...</li> </ol> |
a. Элемент 1 b. Элемент 2 c. Элемент 3 |
Нумерованный список с римскими цифрами в верхнем регистре |
<ol type="I"> <li>...</li> </ol> |
I. Элемент 1 II. Элемент 2 III. Элемент 3 |
Нумерованный список с римскими цифрами в нижнем регистре |
<ol type="i"> <li>...</li> </ol> |
i. Элемент 1 ii. Элемент 2 iii. Элемент 3 |
Вложенные списки
Это такие списки, когда один содержит в себе другой и т.д. Цепочка может быть бесконечной.
Пример, когда нумерованный список содержит маркированный список.
<html>
<head>
<title>маркированный список </title>
</head>
<body>
Список элементов:
<ol>
<li> элемент 1
<ul>
<li> элемент 1-а</li>
<li> элемент 1-б </li>
<li> элемент 1-в</li>
</ul>
</li>
<li> элемент 2 </li>
<li> …………. </li>
<li> элемент n </li>
</ol>
</body>
</html>
Ссылки
Ссылки позволяют переходить с одной веб-страницы на другую. Особенность их состоит в том, что сама ссылка может вести не только на HTML-файлы, но и на файл любого типа, причем этот файл может размещаться совсем на другом сайте. Главное, чтобы к файлу, на который делается ссылка, был доступ.
Для создания ссылки необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. Оба действия выполняются с помощью тега <a>, который имеет обязательный параметр href. В качестве значения используется адрес документа url.
Открывающий тэг |
Закрывающий тэг |
Атрибуты
|
Что означают |
<a> |
</a> |
href=”document.html” |
Указывает ссылку на открываемый документ |
target=”_blank” |
Открыть в новом окне |
||
target=”_parent” |
Открыть в том же окне |
Пример создания ссылки на другой сайт (абсолютная ссылка):
<html>
<head>
<title>абсолютная ссылка </title>
</head>
<body>
<a href="http://www.htmlbook.ru">Ссылка на сайт htmlbook.ru</a>
</body>
</html>
Внутри же сайта используются локальные ссылки. Допустим, мы хотим перейти со страницы index.html на страницу document.html. При создании локальных ссылок надо понимать, какой путь (url) в каком случае следует указывать, поскольку он зависит от расположения файлов.
Если файлы index.html и document.html располагаются в одной папке, то в таком случае ссылка будет выглядеть следующем образом:
<a href="document.html">Ссылка на другую страницу сайта</a>
Если исходный файл располагается в корне сайта, а файл, на который необходимо сделать ссылку — в папке. В этом случае путь к файлу будет следующий:
<a href="название папки/document.html "> Ссылка на другую страницу сайта </a>
Если исходный документ (index.html ) хранится в одной папке, а ссылаемый (document.html) в корне сайта, то перед именем файла в адресе ссылки следует поставить две точки и слэш (/), как показано в примере:
<a href="../document.html "> Ссылка на другую страницу сайта </a>