Выводит текст шрифтом большего чем непомеченная часть текста размера
Выводит текст шрифтом большего чем непомеченная часть текста размера
Для форматирования текста HTML-документа предусмотрена целая группа элементов, которую условно можно разделить на элементы логического и физического форматирования.
Элементы физического форматирования определяют формат отображения указанного в них фрагмента текста в окне браузера (согласно предпочтениям автора документа). Например, для отображения фрагмента курсивом можно использовать тэг курсива .
Между разработчиками НТМL-документов долгое время шли споры о преимуществах и недостатках того или иного подхода. С выходом спецификации НТМL 4.0 эти споры завершились в пользу применения логического форматирования, поскольку был провозглашен принцип отделения структуры документа от его представления. Действительно, только на базе логического форматирования можно гибко управлять представлением документа, используя современные методы (основанные на таблицах стилей, динамически изменяющихся документах и т. д.)
5.1. Элементы логического форматирования.
Элемент используется для отметки цитат или названий книг и статей, ссылок на другие источники и т. д. Браузерами такой текст обычно выводится курсивом. Пример:
Элемент отмечает свой текст как небольшой фрагмент программного кода. Как правило, отображается моноширинным шрифтом. Этот элемент не следует путать с элементом
Элемент отмечает свой текст как удаленный. Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Элемент может использоваться как элемент уровня текста и как элемент уровня блока.
Текст, помеченный элементом обычно отображается перечеркнутым текстом. В спецификации HTML 4.0 этому элементу отдается предпочтение перед элементом физического форматирования или , обозначающих перечеркнутый текст.
Элемент отмечает свой текстовый фрагмент как определение (definition). Например, этим элементом можно отметить какой-либо термин, когда он встречается в тексте в первый раз. Пример:
Элемент отмечает свой текст как вставку (insertion). Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Элемент может использоваться как элемент уровня текста и как элемент уровня блока.
5.1.8. Элемент .
Применение данного элемента предпочтительнее применения элемента физического форматирования .
Элемент отмечает текст как вводимый пользователем с клавиатуры. Обычно отображается моношириггым шрифтом, например:
Применение данного элемента предпочтительнее применения элемента физического форматирования .
Элемент отмечает короткие цитаты в строке текста. В отличие от элемента уровня блока
при отображении не выполняется отделение размеченного текста пустыми строками. Обычно отображается курсивом.
Элемент отмечает текст как образец (sample). Обычное использование этого элемента — отметка текста, выдаваемого программой (sample output). Используется также для выделения нескольких символов моноширинным шрифтом.
Применение данного элемента предпочтительнее применения элемента физического форматирования . Например:
5.1.12. Элемент .
Элемент , как правило, используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст полужирным шрифтом. Пример:
Применение данного элемента предпочтительнее применения элемента физического форматарования . Элементом обычно размечают более важные фрагменты текста, чем те, что размечены элементом .
Элемент отмечает имена переменных программ. Обычно такой текст отображается курсивом. Пример:
5.2. Элементы физического форматирования.
Приведем описание элементов физического форматирования. Часть из них не рекомендуется к использованию спецификацией HTML 4.0 по приведеннным выше причинам. Некоторые элементы отменены (deprecate) спецификацией HTML 4.0, однако они продолжают поддерживаться браузерами.
5.2.1. Элемент .
Элемент отобоажает текст полужирным шрифтом. В большинстве случаев рекомендуется вместо элемента использовать элемент логического форматирования . Пример:
5.2.2. Элемент .
5.2.3. Элемент .
5.2.4. Элемент .
5.2.5. Элементы и .
5.2.6. Элемент .
Элемент выводит текст шрифтом большего (чем непомеченная часть текста) размера. Вместо этого элемента лучше использовать элемент . Например:
5.2.7. Элемент .
Элемент выводит текст шрифтом меньшего размера. Поскольку в HTML нет элемента, противоположного по действию элементу , то для этих целей можно применять элемент . Например:
5.2.8. Элемент .
Элемент сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например:
Элемент сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например:
Элемент задает параметры шрифта. Он относится к элементам физического форматирования уровня текста.
Назначение параметров шрифта непосредственно в тексте документа нарушает основную идею разделения содержательной части документа и описания формы представления документа. Поэтому в спецификации HTML 4.0 данный элемент, а также элемент отнесены к отмененным. Их дальнейшее применение не рекомендуется.
Также как и элемент — не рекомендуемый — и имеет те же атрибуты.
Выводит текст шрифтом большего чем непомеченная часть текста размера
Урок №2. Форматирование текста.
Цели работы:
1.Знакомство с физическими и логическими стилями форматирования текста.
2.Закрепление изученного материала на примерах.
3.Повторение ранее изученного материала.
Для форматирования текста HTML-документов предусмотрена целая группа тэгов, которые условно можно разделить на тэги физического и логического форматирования.
Под физическим стилем принято понимать прямое указание браузеру на модификацию текущего текста. Рассмотрим некоторые тэги физического форматирования.
- отображает текст полужирным шрифтом;
- отображает текст курсивом;
- отображает текст моноширинным шрифтом;
- отображает текст подчёркнутым;
или - отображает перечёркнутый текст;
- выводит текст шрифтом большего (чем непомеченная часть текста) размера;
- выводит текст шрифтом меньшего размера;
- сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов.
- сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера.
- указывает параметры шрифта. Он относится к тэгам физического форматирования уровня текста. Различные параметры шрифта в одном документе нарушают его эстетический вид, поэтому данный тэг в версии HTML 4.0 отнесён к отмененным. Для тэга могут задаваться следующие параметры: face, size и color.
Параметр face служит для указания типа шрифта, например, Times New Roman, Arial, Courier и т.д. Программа будет выводить текст указанным типом только в том случае, если он имеется на компьютере. Можно указать как одно, так и несколько названий шрифтов, разделяя их запятыми. Список шрифтов просматривается слева на право. Если на компьютере пользователя нет шрифта, указанного в списке первым, то делается попытка найти следующий шрифт и т.д. Если не найден ни один из указанных шрифтов, то браузер по умолчанию отображает текст шрифтом Times New Roman.
Параметр size служит для указания размера шрифта в условных единицах от 1 до 7. Размер нормального шрифта считается равным 3.
Параметр color служит для задания цвета шрифта, например, color=blue означает, что заданный текст отобразится синим.
Приведем пример html–кода, обобщающего параметры тэга :
С выходом спецификации HTML 4.0 был провозглашён принцип отделения структуры документа от его представления, благодаря которому логическое форматирование стало более предпочтительным, чем физическое. Разные браузеры толкуют одни и те же метки логических стилей по-разному. Рассмотрим самые распространённые логические стили.
- (от английского emphasis – акцент) используется для выделения важных фрагментов текста. Обычно браузеры отображают такой текст курсивом.
- используется для выделения важных фрагментов текста, отображается полужирным шрифтом.
- как правило, отображается моноширинным шрифтом. Рекомендуется использовать для фрагментов исходных текстов.
- отмечет текст как образец. Используется также для выделения нескольких символов моноширинным шрифтом.
- рекомендуется использовать для указания того, что надо ввести с клавиатуры. Обычно отображается моноширинным шрифтом.
- рекомендуется использовать для написания имён переменных, отображается курсивом.
- используется для отметки цитат или названий книг и статей, ссылок на другие источники. Текст, заключенный в этот контейнер, выводится курсивом.
- этот тэг отмечает свой текст как удаленный (перечеркнутый). Полезно этот тэг использовать для отметки изменений, вносимых в документ от версии к версии.
Подытожим новый материал обобщающим примером 2.2.
Сохраните данный документ как “xxx.htm”.
Задание 2.1: По заданному виду HTML-страницы восстановите HTML-код. Подсказка: В данном документе применены тэги:
заголовка первого уровня;
абзаца (с различным выравниванием);
определяющие горизонтальную линию шириной во весь экран, толщиной 3;
определяющие полужирный, курсивный, подчеркнутый, перечеркнутый, приподнятый, опущенный шрифты; комбинацию полужирного и курсивного шрифта;
тэг для выделения первой буквы заголовка красным цветом (color=red), текста стиха красным цветом, шрифтом Monotype Corsiva, размером 5;
тэг прерывания строки
.
В конце страницы использован спецсимвол определяющий знак Copyright.
Для обращения к следующему занятию Вам необходимо пройти тест
Форматирование текста
В языке HTML предусмотрены специальные теги, предназначенные
для форматирования текста. Они позволяют изменять вид шрифта, цвет, раз-мер и др.
Это полужирный шрифт
Тег отображает текст курсивом. Например:
Это моноширинный шрифт
Пример подчеркивания текста
Тег отображает текст, перечеркнутый горизонтальной линией. Например:
Пример зачеркивания текста
Тег выводит текст шрифтом большего (чем непомеченная часть текста) размера. Например:
Шрифт большего размера
Тег выводит текст шрифтом меньшего размера. Например:
Шрифт меньшего размера
Тег сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например:
Шрифт нижнего индекса
Тег сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например:
Шрифт верхнего индекса
Теги форматирования могут быть вложенными друг в друга. При этом нужно внимательно следить, чтобы один контейнер находился целиком в другом контейнере. Например:
Этот текст полужирный и
|
Вот так броузер отобразит приведенные выше примеры:
Тег позволяет изменить шрифт для блока текста. Этот тег имеет следующую спецификацию:
Атрибут FACE служит для указания типа шрифта, которым броузер будет выводить текст (если такой шрифт имеется на компьютере). Значением данного атрибута служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющимся у пользователя. Если такой шрифт не найдется, то данное указание проигнорируется и будет использован шрифт, установленный по умолчанию.
Можно установить как один, так и несколько названий шрифтов, разделяя их запятыми. Тогда список шрифтов будет просматриваться слева направо так: если на компьютере пользователя нет шрифта, указанного в списке первым, то делается попытка найти следующий и т.д. Если ни одного шрифта найти не удалось, то будет использоваться шрифт, установленный броузером по умолчанию.
Атрибут COLOR устанавливает цвет шрифта. Значение этого атрибута может быть указано в формате RGB или символьной нотацией.
Пример использования тега :
Пример изменения шрифта
Шрифт по умолчанию
другая форма шрифта
размер увеличен на 1
Этот пример отобразится так:
|
Контейнер DIV
Иногда бывает необходимо произвести выравнивание большого блока документа, содержащего не только текст, но и рисунки, таблицы и т.п. Для этих целей используется элемент-контейнер DIV. Спецификация элемента DIV:
Атрибут ALIGN определяет тип выравнивания содержимого и может иметь те же значения, что и элемент P.
Отступы
Иногда требуется отобразить блок текста с отступом. Для этого блок текста помещают в элемент-контейнер BLOCKQUOTE. Тогда содержимое этого элемента будет отображаться с небольшими отступами слева и справа, а также отделяться от остального текста пустыми строками.
Таблицы
Одним из наиболее мощных и широко применяемых в HTML средств являются таблицы. Они используются не только традиционно как метод представления данных, но и как средство форматирования Web-страниц. Документ HTML может содержать произвольное число таблиц, причем допускается вложенность таблиц друг в друга.
Теги физического форматирования HTML текста
Приведем описание тегов физического форматирования. Часть из них не рекомендуется к использованию спецификацией HTML 4.0 по приведенным выше причинам. Некоторые теги отменены (deprecate) спецификацией HTML 4.0, однако они продолжают поддерживаться браузерами.
Это полужирный шрифт.
Рис. 1.2. Примеры физического форматирования текста (браузером Netscape)
Это моноширинный шрифт.
Пример подчеркивания текста.
Пример зачеркнутого текста.
Тег выводит текст шрифтом большего (чем непомеченная часть текста) размера. Вместо данного элемента лучше использовать или теги заголовков, например,
Шрифт большего размера.
Шрифт меньшего размера.
Тег сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например:
Пример шрифта для нижнего индекса.
Тег сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например:
Пример шрифта для верхнего индекса.
Тег отображает мигающий текст. Этот тег не входит в спецификацию HTML и поддерживается только браузером Netscape. Опытные разработчики крайне редко прибегают к использованию этого тега, поскольку наличие на странице мигающих символов раздражает многих пользователей.
Тег-контейнер является аналогом тега уровня блока
Браузер Microsoft Internet Explorer дополнительно разрешает использование следующих параметров тега: DIR, DATAFLD, DATAFORMATAS, DATASRC. Описание параметров можно найти во второй части книги.
Рис. 1.3. Использование вложенных тегов форматирования текста
Теги форматирования могут быть вложенными друг в друга. При этом нужно внимательно следить, чтобы один контейнер находился целиком в другом контейнере. На рис. 1.3 показан пример использования вложения элемента курсива в элемент полужирного шрифта. Использован следующий фрагмент HTML-кода:
Это полужирный шрифт.
А здесь текст полужирный и курсивный
Тег указывает параметры шрифта. Он относится к тегам физического форматирования уровня текста.
Назначение параметров шрифта непосредственно в тексте документа нарушает основную идею разделения содержательной части документа и описания формы представления документа. Поэтому в спецификации HTML 4.0 данный тег, а также тег отнесены к отмененным. Их дальнейшее применение не рекомендуется.
Несмотря на эти грозные предупреждения, видимо, для самых простых документов физическое форматирование можно считать допустимым. Кроме того, начинать обучение основам форматирования проще всего именно с правил непосредственного указания форматов элементов. До стилевого оформления начинающий разработчик должен еще дорасти.
Тег относится к последовательным элементам, поэтому не может включать в себя элементы уровня блока, например,
Для тега могут задаваться следующие параметры: FACE, SIZE и COLOR. Заметим, что браузер Netscape допускает также использование двух дополнительных параметров: POINT-SIZE и WEIGHT, описание которых опускаем.
Параметр FACE служит для указания типа шрифта, которым программа просмотра пользователя будет выводить текст (если такой шрифт имеется на компьютере). Значением данного параметра служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющего у пользователя. Если такого шрифта не будет найдено, то данное указание будет проигнорировано и будет использован шрифт, установленный по умолчанию.
Можно указать как один, так и несколько названий шрифтов, разделяя их запятыми. Это весьма полезное свойство, так как в разных системах могут быть почти идентичные шрифты, называющиеся по-разному. Другим важным качеством является задание предпочтения использования шрифтов. Список шрифтов просматривается слева направо. Если на компьютере пользователя нет шрифта, указанного в списке первым, то делается попытка найти следующий шрифт и т. д.
Приведем пример использования параметра FACE:
Текст, записанный шрифтом по умолчанию.
Пример задания названия шрифта.
На рис. 1.4 показано отображение примера браузером Netscape. В примере в качестве предпочитаемого указывается шрифт Verdana, при его отсутствии будет использован шрифт Arial и т. д.
Рис. 1.4. Отображение примера браузером Netscape
Этот параметр служит для указания размеров шрифта в условных единицах от 1 до 7. Конкретный размер шрифта зависит от используемой программы просмотра. Принято считать, что размер "нормального" шрифта соответствует значению 3.
Настройки размеров шрифта, используемых по умолчанию, а также величины абсолютного изменения размеров шрифта, зависят от браузеров. На рис. 1.5 показано окно настройки браузера Netscape, в котором задаются шрифты, используемые по умолчанию.
При указании размеров шрифтов записи типа "2" и "+2" (в отличие от большинства языков программирования, в которых унарный знак "+" можно опускать) дают принципиально разный результат.
Приведем пример, в котором использованы различные способы назначения размеров шрифтов. Отображение примера показано на рис. 1.6.
Рис. 1.5. Окно настройки параметров шрифтов браузера Netscape
Рис. 1.6. Назначение размеров шрифтов
Назначение размеров шрифтов
Этот параметр устанавливает цвет шрифта, который может задаваться с помощью стандартных имен или в формате #RRGGBB. Приведем пример документа с разноцветным текстом.
Выбор цвета шрифта
Текст зеленого цвета
Текст красного цвета
Тег может появляться также и в разделе документа.
Заметим, что для тега не существует закрывающего тега.
Задачи по Python с решениями
Свежие записи
Представление текста в
На этом шаге мы рассмотрим тэги физическокого форматирования текста.
Перейдем теперь к перечислению тэгов физического форматирования. Напомним, что они позволяют
конкретно указать способ отображения того или иного фрагмента текста. Старайтесь
без большой необходимости не использовать тэги физического форматирования, а пользоваться
соответствующими тэгами логического форматирования. Дело в том, что в дальнейшем, с развитием
языка HTML, тэги логического форматирования будут выполнять не одно, а сразу несколько
действий над фрагментом текста. Например, требуется использовать один тэг логического
форматирования для изображения фрагмента текста полужирным и курсивным шрифтом или
два тэга физического форматирования для получения такого же результата. Уже
сейчас возможно создание и использование подобных конструкций, однако их описание и
использование выходят за рамки данной книги.
Перечислим основные тэги физического форматирования.
Задание. "Соберите" все примеры в файл PR2.HTML и просмотрите его в
браузере. В результате у вас должен получиться разультат, как на рисунке 1.
Файл этого примера можно взять здесь
Рис.1. Примеры физического форматирования текста
Тэги физического форматирования могут быть вложенными один в другой. В этом случае
важно следить за тем, чтобы тэги одного назначения располагались внутри тэгов другого
назначения, например:
Прежде чем продолжить перечисление тэгов физического форматирования, поговорим о задании цвета.