![]() Главная страница Случайная страница КАТЕГОРИИ: АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника |
Форматирование текста. В HTML предусмотрено 6 стандартных размеров шрифта для оформления заголовков
В HTML предусмотрено 6 стандартных размеров шрифта для оформления заголовков. Они устанавливаются при помощи тегов: < H1> Заголовок стиля 1< /H1>; < H2> Заголовок стиля 2< /H2>; < H3> Заголовок стиля 3< /H3>; < H4> Заголовок стиля 3< /H4>; < H5> Заголовок стиля 3< /H5>; < H6> Заголовок стиля 6< /H6>.
Пример 1. < HTML> < HEAD> < TITLE> Первый пример простого документа на языке гипертекстовой разметки < /TITLE> < /HEAD> < BODY> Стили форматирования в HTML < H1> Стиль заголовка первого уровня. Самый крупный и тяжёлый < /H1> < H2> Стиль заголовка второго уровня с меньшими размерами и толщиной шрифта < /H2> < H3> Стиль заголовка третьего уровня ещё меньше < /H3> < H4> Стиль заголовка четвёртого уровня < /H4> < H5> Стиль заголовка пятого уровня < /H5> < H6> Стиль заголовка шестого уровня. Самый маленький и светлый из базовых шрифтов < /H6> < P> Тег для выделения абзаца. Его можно использовать без завершающего тега, так как новый тег Р по смыслу означает не только начало, но и конец предыдущего абзаца. Грамотно с точки зрения языка HTML и удобно для броузера завершать абзац закрывающим тегом < /P> < /BODY> < /HTML>
Для форматирования абзаца используются теги < P> - создание нового абзаца и < Br> - код пропуска строки или большой отступ. Для выравнивания, видоизменения и выделения текста используются теги < P> с атрибутами ALIGN. Теги < P ALIGN=" right" >.. < /P> выполняют выравнивание по правому краю. При задании выравнивания по правому краю концы строк находятся на одном уровне, а начальные символы строк - на разных уровнях. При задании выравнивания по левому краю с помощью тегов< P ALIGN=" left" >.. < /P> начальные элементы строк находятся на одном уровне, а концы строк - на разных уровнях. Этот вид выравнивания часто используется при написании эпиграфов или просто для оригинальности. Теги < P ALIGN=" center" >.. < /P> выполняют выравнивание по центру. Форматирование шрифта выполняют теги: < B> < /B> - жирный текст; < I> < /I> - курсив; < U> < /U> - подчеркнутый текст. Вид шрифта - очень важная часть дизайна Web-страниц. Он позволяет придавать тексту определенную выразительность, эмоциональность. Строгие шрифты показывают важность текста, его официальность. Рукописные шрифты придают тексту некоторую красоту, поэтичность и т.д. Существует огромное множество шрифтов, но HTML сейчас только начинает развиваться в области использования шрифтов. В классической версии языка HTML 3.0 эта проблема решена единственным образом - доступны шрифты, установленные в системе пользователя с помощью атрибута FACE= в теге FONT. Сейчас появляются новые технологии. Например, загрузка шрифтов из Интернета или встраивание шрифтов непосредственно в документ. Ещё одной новаторской идеей в этой области является использование графических литер с определенным начертанием вместо текста. После загрузки 2-3 листов, написанных таким методом, почти все буквы оказываются загруженными в кеш броузера, и открытие последующих страниц происходит очень быстро. Для задания размера шрифта используется атрибут SIZE= в теге FONT. Можно задавать базовый размер шрифта тегом < BASEFONT SIZE=x> для использования на всей странице, а в нужных участках текста использовать атрибут SIZE= для задания размера определенного участка. По умолчанию используется тег < BASEFONT SIZE=3>. Заголовок < H1> имеет размер 6. Чтобы сделать шрифт больше, чем < H1>, можно выбрать размер шрифта, равный 7. Основное отличие тега < FONT> от < Hx> заключается в том, что он не разбивает строку. В HTML можно использовать вышеуказанный список шрифтов в теге < FONT>. Можно перечислить в этом списке несколько шрифтов, из которых броузер выберет первый, установленный в системе, и использует его для отображения текста. Например, < FONT FACE=" Arial, COMIC SANS MS, Tahoma, AG_Cooper" > текст< /FONT>. Размеры символов (1, 3, 5, 7) в тексте указываются тегами: < FONT SIZE=" 1" >, < FONT SIZE=" 3" >, < FONT SIZE=" 5" >, < FONT SIZE=" 7" >. Поместив текст между каким-либо из этих тегов и закрывающим тегом < /FONT>, получим шрифт нужного размера. Вид шрифта в тексте: < FONT FACE=" Times New Roman" > ABC< /FONT>. < FONT FACE=" System" > DEF< /FONT>. < FONT FACE=" Arial" > GHI< /FONT>. < FONT FACE=" Courier" > xyz< /FONT>. Для задания размера текста существуют и другие теги. Это теги < BIG> < /BIG> и < SMALL> < /SMALL>. Заключенный между ними текст будет соответственно больше или меньше окружающего текста. Можно использовать все виды красок на странице, задавая цвет в атрибуте COLOR= тега < FONT>. Цвета текста в документе задаются в кодировке RGB - шестью шестнадцатеричными числами или именованными цветами, например: < FONT COLOR=" #FF0000" > Красный текст< /FONT>. < FONT COLOR =" #CF2CD4" > Лиловый текст< /FONT> < FONT COLOR =" #0000FF" > Синий текст < /FONT> < FONT COLOR=" #00FF00" > Зелёный текст< /FONT> < FONT COLOR=" #808080" > Серый текст< /FONT> < FONT COLOR=" silver" > Серебряный текст < /FONT> < FONT COLOR=" green" SIZE=" 4" > Зелёный текст с размером шрифта 4. < /FONT> Наименования цветов приведены в Таблице 4.1. Атрибуты тега < BODY> для задания цвета фона документа - BGCOLOR; цвета текста - TEXT; цвета ссылок - LINK; атрибутом COLOR= просмотренных ссылок – VLINK; цвета ссылок в момент нажатия на них правой кнопкой – ALINK. Цвета текста, ссылок и фона задаются в кодировке RGB - шестью шестнадцатеричными числами или именованными цветами, например: < BODY BGCOLOR=" #FFFF88" TEXT=" #0000FF" LINK=" #FF0000" VLINK=" #CF2CD4" ALINK=" #C033FF" > С помощью атрибута BACKGROUND тега < BODY> можно вставить небольшие рисунки (размножаемые Web-броузером) в формате gif (файл - background.gif) или jpg (файл - background.jpg), т.е. создать графический фон: < BODY BACKGROUND=" background.gif" > - размноженный рисунок возникает на заднем плане. Для наилучшего усвоения информации используют различные способы выделения абзацев. Тег списка < DL> (Definition List) позволяет создавать списки определений, т.е. отдельные абзацы с отступом без нумерации или маркеров. В конце определения необходимо поместить закрывающий тег < /DL>. Списки состоят из двух частей: определения (DT) и описания (DD). Атрибут title показывает текст в виде всплывающей подсказки. Таблица 4.1.
Пример 2. < HTML> < BODY> < DL title = «это список»> < DT> HTML < DD> Это язык разметки гипертекста < DT> Броузер < DD> Это программа для просмотра гипертекста в интернете < /DL> < /BODY> < /HTML> В результате такого форматирования получим определения следующего вида. HTML Это язык разметки гипертекста Броузер Это программа для просмотра гипертекста в интернете
Тег < BLOCKQUOTE> создает поля слева и справа от текста. Атрибуты LEFTMARGIN=n, RIGHTMARGIN=n, TOPMARGIN=n, где n - ширина поля в пикселях, указываются в теге < BODY> для задания левого, правого и верхнего полей для всей страницы. Теги < PRE> и < /PRE> используются для отображения текста точно так, как он записан в HTML (заранее отформатированного текста). Теги < MULTICOL> и < /MULTICOL> выводят текст в несколько колонок (используются только для броузера Netscape 3.0 и выше). Они имеют следующий полный формат: < MULTICOL COLS=" x" GUTTER=" у" > текст < /MULTICOL>, где x - количество столбцов, у - расстояние между столбцами. Размещение текста в одну строку с добавлением в нижней части окна горизонтальной полосы прокрутки выполняется следующим образом - поместить текст между тегами < NOBR>; - если надо оборвать строку в определенном месте, - поставить там тег < BR>; - если надо задать места переноса текста - поставить там тег < WBR>. Для задания отступа перед новым абзацем используется тег < TAB INDENT=n>, где n - число так называемых n-пробелов. Пример. Установка пяти подряд расположенных пробелов между буквами А и Я с применением символа неразрушающего пробела - & nbsp: А& nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Я Для создания линий используется тег < HR> с атрибутами SIZE=, WIDTH=, ALIGN=, задающими соответственно высоты в пикселях, ширины в пикселях или в процентах от размера окна и выравнивание. Дополнительный атрибут NOSHADE создает линию без рельефности. С помощью этих атрибутов можно создавать очень разнообразные размещения текста. Например, тег < HR NOSHADE SIZE=30 WIDTH=" 30%" ALIGN=LEFT> создаёт толстую линию на треть страницы, расположенную слева.
|