- •Общие сведения о языке разметки гипертекста(html)
- •Общие сведения о языке разметки гипертекста (html)
- •Структура html-документа
- •Знакомство с графическими объектами
- •Создание gif-файлов
- •Цвета в html
- •Главное о форматировании текста
- •Заголовки
- •Начертание шрифта
- •Выравнивание и отступы
- •Выравнивание текста по левому или правому краю
- •Центрирование объектов
- •Поля вокруг изображения
- •Фоновые изображения и фоновый цвет
- •Локальные ссылки
- •Ссылка - строка
- •Ссылка - изображение
- •Якорь и ссылка на него
- •Глобальные ссылки
- •Дополнительные возможности форматирования текста
- •Текст, обтекающий границы объекта
- •Отображение текста в одной строке (без переноса на другую строку)
- •Выделение абзацев с помощью списков определений и полей
- •Рекомендации по проведению занятий
Выделение абзацев с помощью списков определений и полей
Иногда бывает необходимо привлечь внимание читателей к наиболее важным разделам в тексте. На странице с обилием информации следует отделить введение от основной части, пропустив немного места. Помимо того, что страница станет лучше выглядеть, такой текст легче читать, ведь многие программы просмотра стремятся втиснуть как можно больше в окно просмотра, совсем не оставляя полей. Существует несколько способов отделить части текста друг от друга. Каждый из них имеет свои достоинства и недостатки. Первый способ отделения текста - использование тега списка <DL>(Definition List), он напоминает применение отступов в обычных текстовых редакторах. Тег<DL>был создан для форматирования текста, определяющего какой-то термин. Определяемый термин записывается на одной строке, а его определение - на следующей, с небольшим отступом вправо. Тег<DL>позволяет создавать отдельные абзацы с отступом без нумерации или маркеров. Отступ делается от левого края. В конце определения поместите закрывающий тег</DL>. В файле DL1.htm используется тег<DL>, а также пояснен второй способ отделения текста:
<HTML>
<BODY>
Этот абзац записан без сдвига. <P>
<DL><DL>Тег <DL> сдвигает только левую границу абзаца. </DL><P>
<DL><DL> Если у Вас на странице несколько тегов <DL>, то текст постепенно сдвигается
все больше вправо.</DL></DL></DL><P>
<BLOCKQUOTE>Второй способ отделения текста - использование тега <BLOCKQUOTE>, который
добавляет поля слева и справа от текста. </BLOCKQUOTE><P>
<BLOCKQUOTE><BLOCKQUOTE>Это полезный тег, поскольку он позволяет расположить текст
компактно в центре страницы. При использовании <BLOCKQUOTE> несколько раз текст все
больше сжимается к центру. </BLOCKQUOTE></BLOCKQUOTE><P>
</BODY>
</HTML>
В файле DL2.htm пояснен третий способ отделения текста:
<HTML>
<BODY LEFTMARGIN="100">
Третий способ отделения текста применим для программы просмотра MS Internet Explorer,
которая допускает применение атрибутов LEFTMARGIN=n и TOPMARGIN=n в теге <BODY>.
Атрибут LEFTMARGIN= задает левое поле для всей страницы. TOPMARGIN= определяет верхнее
поле. Число n показывает ширину поля в пикселях. Например, на данной странице
тег <BODY LEFTMARGIN="100"> создает на всей странице левое поле шириной 100 пикселей.
При n, равном 0, левое поле отсутствует.
</BODY>
</HTML>
Задание 5.3.1. Просмотреть страницы, создаваемые файлами DL1.htm и DL2.htm. Уяснить влияние тегов и атрибутов.Задание 5.3.2.Используя файлы DL1.htm и DL2.htm как исходные, запи-сать в рабочую папку файлы DL3.htm и DL4.htm, в которых по своему вкусу расставить абзацы, центрировать текст и создать левое поле.Задание 5.3.3.Используя файл DL4.htm как исходный, записать в рабочую папку файл DL5.htm, в котором применить атрибут TOPMARGIN=n.
Рекомендации по проведению занятий
Данную работу можно эффективно использовать в электронном варианте. Текстовое пояснение материала при этом может сопровождаться, во-первых, графическим представлением сайта, более качественным (цветным, большим, четким), чем рисунок в брошюре. Например, в тексте имеется рис.1, которому соответствует файл ris1.htm. Текстовый процессор Word-7 позволяет в одном окне читать текст пособия, а в соседнем окне одновременно рассматривать сайт, используя соответствующий htm-файл. Если Word-7 отсутствует у пользователя, то можно читать текст посредством другой программы, а сайт одновременно рассматривать с помощью программы просмотра. Во-вторых, некоторые рисунки просто нецелесообразно помещать в брошюру. Например, в пункте 8.2 рисунок представляет собой вертикальную пунктирную линию с уменьшающейся длиной штриха. Занимать полстраницы такой линией нелепо. Этот рисунок можно рассмотреть на дисплее, используя файл HR2.htm. В пункте 8.4 рассмотрена страница сайта, загружающая другую страницу. Брошюра не может реализовать перезагрузку, обеспечиваемую файлом refresh1.htm. Рисунок в пособии показал бы мгновенное состояние бегущей строки (пункт 8.5), а динамику движения может показать только дисплей. В пункте 8.6 рассмотрен файл BGSOUND.htm, обеспечивающий воспроизведение звука, естественно, что соответствующего рисунка в тексте нет. В-третьих, изучение материала по электронным методическим указаниям включает в себя эксперименты. Эти эксперименты проводятся студентами во время практических занятий в компьютерных классах. Студенты знакомятся с излагаемыми сведениями и создают свои страницы сайтов. Для этого достаточно посредством текстового редактора Блокнот набрать и сохранить в рабочей папке соответствующий htm-файл. При дефиците времени можно текстовым редактором Блокнот прочесть из той папки, которая содержит данную методичку, готовый файл, например, ris1.htm, внести в него требуемые изменения и записать в рабочую папку новый файл с именем, например, ris1a.htm. Программа просмотра или Word-7 покажет результат эксперимента после чтения нового документа. Такая работа и является выполнением заданий на практическом занятии. Задания на проведение экспериментов указаны в конце каждого пункта. Тексты заданий и документов, созданных при их выполнении, студенты записывают в свои тетради. Перед выполнением заданий в каждом пункте следует сначала внимательно прочесть этот пункт и понять последовательность действий, которые предстоит осуществить. Чтение удобно проводить при максимизированных размерах окна текстового процессора Word. Затем перед началом работы с текстовым редактором Блокнот следует уменьшить ("восстановить") размеры окна текстового процессора Word. Это позволит одновременно видеть на дисплее и задание, и текст, редактируемый Блокнотом.