Форматирование текста. 1.1. Заголовки. Для задания размера шрифта применяют теги заголовков

Лабораторная работа №1

1.1. Заголовки. Для задания размера шрифта применяют теги заголовков. Таких тегов шесть и они используются для определения заголовков различного уровня. При переходе от заголовка первого уровня к заголовку шестого уровня постепенно уменьшается размер и толщина букв шрифта. Теги заголовков записываются как <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Текст, заключенный в тег заголовка, всегда начинается с новой строки. Текст, следующий за заголовком, также начинается с новой строки.

Теги заголовков имеют атрибуты:

align – выравнивание; значения: center, left, right (по центру, левому и правому краю окна браузера);

title – текст всплывающей подсказки, появляющейся при наведении указателя мыши на текст заголовка.

Запустите программу «Блокнот». Наберите в нем следующий код HTML. Сохраните файл с расширением html. Запуская ваш файл, дважды щелкнув по нему, вы увидите Web-страничку.

При наборе HTML-кода всех последующих примеров выполняйте аналогичные действия.

Запуская ваш файл, дважды щелкнув по нему, вы увидите Web-страничку.

1.2. Управление шрифтом. Кроме использования стандартных размеров и начертаний шрифтов можно определять шрифты для каждого фрагмента текста с помощью специальных тегов. Самый простой способ – использование тегов физических стилей.

<b> – полужирный, <i> – курсив, <u> – подчеркнутый, <s> – вычеркнутый, <tt> – пишущая машинка.

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

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

С помощью тега <basefont> можно установить основной шрифт, который используется в документе по умолчанию. Этот тег имеет необязательные атрибуты:

color=цвет;

face=”имя шрифта”;

size=число, где число=1,2,…, 7 и определяет размер шрифта (если атрибут size не задан, то по умолчанию устанавливается значение 3);

title=”текст всплывающей подсказки”.

С помощью контейнерного тега <font> можно настроить шрифт для содержащегося в нем текста. Тег <font> имеет такие же атрибуты, как и тег <basefont>. Особенностью атрибута size для тега <font> является то, что с его помощью можно установить не только абсолютный, но и относительный размер шрифта. В последнем случае значение атрибута size представляет собой целое число со знаком “+” или “–“ для указания, на сколько следует увеличить или уменьшить размер шрифта относительно основного.

В математических формулах, а также для ссылок на подстрочные замечания часто применяются индексы, которые отличаются от основного текста положением относительно строки и размером. Для этой цели служат контейнерные теги <sup> и <sub> для верхних и нижних индексов соответственно.

Кроме того, можно использовать контейнерные теги <big> и <small>. Тег <big> увеличивает на единицу размер шрифта, а тег <small> задает более мелкий шрифт относительно основного шрифта.

Для выделения фрагмента текста пустыми строками сверху и снизу, а также отступом от левого края окна браузера служит контейнерный тег <blockquote>.

1.3. Бегущая строка. Браузер Internet Explorer поддерживает контейнерный тег <marquee>, который позволяет создать так называемую бегущую строку, т. е. эффект прокручивания текста в заданном поле. Характеристики бегущей строки задаются следующими атрибутами:

width – ширина поля бегущей строки в пикселях или процентах от ширины окна;

height – высота поля бегущей строки (в пикселях);

hspace, vspace – интервалы по горизонтали и вертикали между текстом строки и краями её поля (в пикселях).

align – положение текста бегущей строки в её поле; возможные значения:

· top (вверху);

· bottom (внизу);

· middle (посередине);

direction – определяет направление движения; возможные значения:

· left (справа налево);

· right (слева направо);

behavior – характер движения строки; возможные значения:

· scroll – текст появляется от одного края и скрывается за другим;

· slide – строка вытягивается из одного края поля и останавливается у другого края;

· alternate – задает переменное направление движения, от одного края к другому и обратно;

loop – количество повторений текста в бегущей строке, задаваемое числом; если необходимо «бесконечное» количество повторений, то следует задать аргумент в виде ключевого слова infinity. Атрибут loop не влияет на поведение бегущей строки, если для атрибута behavior заданы значения alternate или slide.

scrollamount – устанавливает длину в пикселях «прыжка» текста за один такт; при большом значении этого параметра текст движется рывками, а при малом – замедленно;

scrolldelay – определяет величину паузы между тактами перемещения текста в миллисекундах;

bgcolor – устанавливает цвет поля бегущей строки, задаваемый шестнадцатеричным числом или именем.

В тег <marquee> в качестве прокручиваемого объекта можно вставлять не только текстовые элементы, но и, например, графические изображения.

1.4. Предварительно отформатированный текст. Списки. Если необходимо включить в HTML-документ фрагмент текста, предварительно отформатированный обычными средствами текстового редактора то целесообразно использовать контейнерный тег <pre>. Теги форматирования текстов, содержащие тег <pre> и находящиеся внутри этого тега, влияют на отображение предварительно отформатированного текста.

Теги форматирования текстов, содержащие тег <pre> и находящиеся внутри этого тега, влияют на отображение предварительно отформатированного текста.

Для представления информации в виде простых и иерархических списков в HTML имеется несколько тегов. Наиболее часто используются маркированный и нумерованный списки.

Маркированный список задается контейнерным тегом <ul>. Элементы списка располагаются внутри этого тега; каждому элементу списка предшествует тег <li>. Браузер отображает элементы списка с новой строки в виде столбца с отступом и маркерами. Вид маркера определяется атрибутом type, который может принимать следующие значения:

disc – закрашенный кружок (значение по умолчанию);

circle – незакрашенный кружок;

square – закрашенный квадратик.

Атрибут type с этими же параметрами можно использовать и в теге <li> внутри тега <ul>, чтобы определить вид маркера для данного элемента списка. Кроме того, тег <li> имеет необязательный атрибут value, принимающий в качестве значения произвольную строку символов. Это значение может быть обработано в сценарии, который выполняется по некоторому событию (например, при щелчке на элементе списка).

Иерархически маркированный список создается путем вложения контейнеров <ul> друг в друга.

Нумерованный список задается с помощью контейнерного тега <ol>. Его построение аналогично организации маркированного списка, особенность заключается в способе пометки элементов, определяемом атрибутом type, который может принимать следующие значения:

1 – нумерация арабскими цифрами (значение по умолчанию).

A – маркировка прописными латинскими буквами в алфавитном порядке.

a – маркировка строчными латинскими буквами в алфавитном порядке.

I – нумерация большими римскими цифрами;

i – нумерация маленькими римскими цифрами.

Атрибут type можно использовать как в теге <ol> так и в теге <li>.

С помощью атрибута start тега <ol> допустимо указать маркер первого элемента в списке. Значением этого атрибута может быть число. Если start=7, то при type=1 нумерация элементов начинается с 7, при type=А первый элемент получает маркер в виде буквы «G».

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

Список определений содержит элементы, которые состоят из двух частей – определяемой и определяющей. Список определений задается контейнерным тегом <dl>. Элемент списка задается двумя контейнерными тегами: <dt> – для определяемого термина и <dd> – для его описания. Браузер отображает определяемый термин в отдельной строке, а его описание – ниже и с отступом.

Поиск по сайту: