-
Форматирование документа
В предыдущих разделах мы вкратце ознакомились со структурой документа, узнали о том, что такое ссылки и как их делать. Теперь рассмотрим, как выполняется форматирование документов. Следует отметить, что форматирование и оформление – не одно и то же. Форматирование задает структуру, а оформление – внешний вид. И если до недавних пор все это было перемешано, то теперь для оформления в HTML 4 используют каскадные таблицы стилей, или CSS. О том, что это такое и как их использовать, вы узнаете уже через главу, а к рассмотрению структуры приступим прямо сейчас.
К элементам структурной разбивки в первую очередь относятся абзацы и заголовки. В HTML для обозначения абзаца используется элемент Р, а для заголовков – H1, H2, НЗ, Н4, Н5 и Н6. Кроме того, существуют так называемые элементы уровня блока, например DIV, предназначенный для форматирования части или блока страницы, например группы абзацев.
Рассмотрим применение этих элементов на практике. Откройте файл «index.html» и измените его следующим образом:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Главная страница <TITLE>
</HEAD>
<BODY>
<H!>Приветствую вас на своей страничке!</Н1>
<Н2>Это – главная страница. </Н2>
А вот мое <А HREF="hello/hello.html">приветствие </А>.
Больше пока ничего нет.
</BODY>
</HTML>
Абзац, формируемый элементом Р, также заставляет браузер создать отступ величиной приблизительно в одну строку до и после текста. Однако если поставить несколько тегов Р подряд, то эффект будет таким же, как и от одного. Поэтому для задания более значительного отступа применяют несколько элементов BR. Он заставляет браузер сделать то, чего вы добиваетесь, нажимая на клавиатуре клавишу «Enter» при редактировании текста в обычном текстовом редакторе.
-
Синтаксис гипертекстовой разметки
Прежде чем продолжить знакомство с технологиями создания страниц, следует сделать отступление насчет синтаксиса в HTML-документах. Прежде всего это касается правил использования кавычек для строковых ресурсов. Они сводятся к следующему:
-
Вы можете использовать как одинарные – ('), так и двойные – (") кавычки, но при этом строка должна быть заключена в кавычки одного типа:
<А HREF= "http://www.snkey.net" > – верно
<А HREF= 'http://www.snkey.net' > – тоже верно
<А HREF= "http://www.snkey.net'> – неверно!
-
В самом языке HTML рекомендуется все значения атрибутов элементов заключать в кавычки, даже если они не содержат пробелов:
<IMG SRC= «5.gif» АLТ= «Рисунок N 5» > – верно;
<IMG SRC=5.gif ALT='Рисунок N 5' > – тоже верно;
<IMG SRC=5.gif ALT=Рисунок N 5 > – неверно!
Атрибуту ALT будет присвоено значение «Рисунок», а «N» и «5» будут нераспознанными атрибутами.
-
Если требуется указать кавычки внутри строки, то используйте кавычки разного типа:
<IMG SRC="5.gif" АLТ="Рис. 5 – 'Цветочки' " > – верно;
<IMG SRC=5.gif АLТ='Рис. 5 – "Цветочки" ' > – тоже верно;
<IMG SRC=5.gif АLТ="Рис. 5 – "Цветочки" " > – неверно!
Атрибуту ALT будет присвоено значение «Рис. 5 – ».
-
Все, что сказано в 1-м и 3-м пунктах, верно и для JavaScript:
var string1 = "Некоторая строка"
var string2 = 'Другая строка'
var strings = 'Строка с "Кавычками" '
-
Кроме того, в JavaScript для того чтобы вставить в строку кавычки или иные символы, можно применять обратную косую черту:
var string1 = "Некоторая строка с \"Кавычками\" "
var string2 = 'Другая строка с \'Кавычками\' '
Будьте предельно внимательны при расстановке кавычек, поскольку их отсутствие или неправильное использование может привести к непредсказуемым результатам. Например, если вы не закроете кавычку, как в приведенном ниже примере, то почти весь текст HTML-документа будет воспринят как содержание атрибута CONTENT элемента МЕТА:
<!DOСТУРЕ HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN" >
<HTML>
<HEAD>
<TITLE>Заголовок</TITLE>
<META NAME=Description СОNТЕNТ="Мой документ >
</HEAD>
<BODY>
Содержимое тела документа, которое никто не увидит.
<А HREF="foo.htm">Ссылка, которая не будет работать </А>
</BODY>
</HTML>
Когда интерпретатор дойдет до CONTENT=«, он все последующие символы, вплоть до первой встретившийся кавычки, присвоит атрибуту CONTENT. Далее foo.htm» (именно так, вместе с примыкающей кавычкой) будет принят за нераспознаваемый атрибут элемента МЕТА. Затем угловая скобка – > будет распознана как завершение элемента МЕТА, и все дальнейшее будет показано как тело документа. В результате окно браузера будет выглядеть, как показано на рис. 3.7.
Рисунок 3.7. Ошибки при расстановке кавычек
Если же закрывающей кавычки так и не найдется, то все содержимое HTML-документа, начиная с «проблемного» элемента будет выведено в окно браузера. При этом, конечно, содержимое будет показано, а ссылка будет работать, но это будет слабым утешением. Окно браузера будет выглядеть, как показано на рис. 3.8.
Рисунок 3.8. Другая ошибка
Еще одна часто встречающаяся ошибка – это использование обратного слеша – «\» – вместо обычного – «/». Если для работы в DOS и Windows используется обратный слеш, то в UNIX и в Интернет вообще – только обычный.