HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов - [14]

Шрифт
Интервал

ГЛАВА 3. Оформление текста 

В предыдущей главе мы научились структурировать текст Web-страницы, разбивая его на логические "куски". Также мы узнали о комментариях HTML, которые позволяют создавать небольшие заметки прямо в коде Web-страницы. И создали две Web-страницы нашего первого Web-сайта. В этой главе мы продолжим работать с текстом. Мы научимся оформлять его, выделяя отдельные фрагменты текста, чтобы привлечь к ним внимание посетителя. А еще мы научимся вставлять в текст недопустимые символы.

Выделение фрагментов текста

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

Однако на самом деле теги и — это нечто большее, чем просто выделение текста. Они дают фрагменту текста, являющемуся их содержимым, особое значение с точки зрения Web-обозревателя. Они говорят, что данный фрагмент текста является важным, и на него следует обратить внимание посетителя. Тег делает фрагмент текста очень важным, а тег — менее важным (листинг 3.1).

Листинг 3.1

Я — очень важный текст и поэтому набран полужирным шрифтом! Прочитайте меня в первую очередь!

А я — менее важный текст и набран курсивом. Не забудьте прочитать меня, но можете сделать это потом.

HTML предусматривает для выделения текста довольно много тегов (табл. 3.1), имеющих две особенности:

— все они парные;

— служат для выделения частей текста блочных элементов (абзацев, заголовков, пунктов списков, текста фиксированного форматирования; подробнее о блочных элементах см. в главе 2).

Таблица 3.1. Теги HTML, предназначенные для выделения фрагментов текста


Как уже говорилось ранее, все эти теги служат для выделения фрагментов текста, являющихся частью блочных элементов, скажем, абзацев (листинг 3.2). Элементы Web-страницы, которые они создают, не являются независимыми и не отображаются отдельно от их "соседей", а принадлежат другим элементам — блочным. Такие элементы Web-страницы называются встроенными.

Листинг 3.2

Теги HTML служат для создания элементов Web-страниц.

Соблюдайте порядок вложенности тегов!

Тег P служит для создания абзаца HTML.

Язык HTML служит для создания содержимого

Web-страниц.

Наберите в Web-обозревателе интернет-адрес

http://www.w3.org.

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

Для практики давайте откроем Web-страницу index.htm и выделим некоторые фрагменты ее текста с помощью тегов, перечисленных в табл. 3.1 (листинг 3.3).

Листинг 3.3

Приветствуем на нашем Web-сайте всех, кто занимается Web-дизайном! Здесь вы сможете найти информацию обо всех интернет-технологиях, применяемых при создании Web-страниц. А именно, о языках HTML и CSS.

.

!DOCTYPE, BODY, EM,

HEAD, HTML, META, P,

STRONG, TITLE

Все эти фрагменты так и просятся: оформите нас надлежащим образом! Мы ведь особенные!

Разрыв строк

Мы совсем забыли поместить на Web-страницы сведения об авторских правах их разработчика, т. е. о нас. Давайте сделаем это. Поместим их в самый низ Web- страниц посредством изученного в главе 2 тега

:

Все права защищены. Читатели, 2010 год.

Все хорошо, за одним исключением. Обычно предупреждение о том, что авторские права защищены, и имя или название разработчика разносят на разные строки. Но как нам это сделать?

Можно, конечно, использовать два тега

: один — для предупреждения, а другой — для имени разработчика. Но тогда строки будут разделены довольно большим расстоянием. (Вспомним — тег
ведет себя как абзац, т. е. отделяется от соседних абзацев отступом.) А это будет выглядеть некрасиво.

Выход — добавить разрыв строк HTML. Он выполняет безусловный перевод строки, в которой он присутствует, в том месте, где проставлен. Разрыв строки определяется одиночным тегом
:

Этот абзац будет разорван на две строки в этом
месте.

Разрыв строки также относится к встроенным элементам Web-страницы.

Давайте вставим разрыв строки в текст сведения об авторских правах, между точкой в первом предложении и началом второго предложения. Пробел между ними можно убрать — он там совершенно не нужен:

Все права защищены.
Читатели, 2010 год.

Откроем исправленную Web-страницу в Web-обозревателе и посмотрим на результат (рис. 3.1). Видно, что текст сведений об авторских правах разделен на строки в том самом месте, куда мы вставили тег
.


Рис. 3.1. Абзац с разрывом строк

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

Продолжить чтение
Еще от автора Владимир Александрович Дронов
Macromedia Flash Professional 8. Графика и анимация

Подробно, доступно и с юмором рассматривается создание современной интернет-графики и анимации с помощью пакета Macromedia Flash Professional 8. Описываются основные инструменты рисования и правки графики, использование слоев, образцов и библиотек, работа с текстом, импорт графики, видео и звука. Рассмотрен процесс производства фильмов стандартными, и весьма богатыми, средствами Flash. Также приводятся краткое описание встроенного языка программирования Flash — Action Script — и методика его применения для разработки интерактивных элементов.

Рекомендуем почитать
Нормы русского литературного языка

Настоящее пособие помогает формированию и совершенствованию у студентов умений и навыков произношения, словоупотребления, использования грамматических форм, правописания и постановки знаков препинания. Предназначено как для практических аудиторных занятий, так и для самостоятельной работы.Для студентов, изучающих курсы «Русский язык и культура речи», «Культура речи», «Стилистика русского языка и культура речи», «Стилистика и литературное редактирование» и др. Данное пособие может быть использовано также выпускниками средних школ и абитуриентами при подготовке к Единому государственному экзамену по русскому языку.

Сочинения гр. А. К. Толстого как педагогический материал. Часть 2. Эпические мотивы

«Лирика обладает одним несомненным преимуществом перед другими родами поэзии: она лучше всего освещает нам личный мир поэта, ту сферу, которую выделяет для него в широком Божьем мире его темперамент, обстановка, симпатии, верования; она показывает степень отзывчивости поэта; т.е. его способности переживать разнородные душевные состояния: она часто открывает нам уголки поэтической деятельности, где живут не оформившиеся еще образы, задатки для определенных фигур эпоса и драмы. В эпосе и драме образы становятся разнообразнее и пестрее, но вместе с тем славятся объективнее, особенно в драме…».

Уголовное право. Особенная часть

В книге кратко изложены ответы на основные вопросы темы «Уголовное право. Особенная часть». Издание поможет систематизировать знания, полученные на лекциях и семинарах, подготовиться к сдаче экзамена или зачета.Пособие адресовано студентам высших и средних образовательных учреждений, а также всем интересующимся данной тематикой.

Самоучитель Adobe After Effects 6.0

Обучение созданию профессиональных видеофильмов и обработки их на компьютере представлено в виде 12 уроков. Рассматривается, как с помощью программы Adobe After Effects можно редактировать и рисовать последовательность кадров, добавлять титры и заголовки, применять различные видеоэффекты, редактировать звуковое сопровождение фильма. Описывается процесс настройки прозрачности и наложения слоев видео для последующего экспорта фильма в различных форматах. Показываются способы создания анимации при масштабировании, поворотах и в движении с наложением титров и спецэффектов.

Финансовое право

В учебном пособии в краткой и доступной форме рассмотрены все основные вопросы, предусмотренные государственным образовательным стандартом и учебной программой по дисциплине «Финансовое право».Книга позволит быстро получить основные знания по предмету, а также качественно подготовиться к зачету и экзамену.Рекомендуется студентам, аспирантам и преподавателям по юридическим, экономическим и управленческим специальностям, а также сотрудникам банков.Автор книги, Шевчук Денис Александрович, имеет опыт преподавания различных дисциплин в ведущих ВУЗах Москвы (экономические, юридические, технические, гуманитарные), два высших образования (экономическое и юридическое), более 30 публикаций (статьи и книги), Член Союза Юристов Москвы, Член Союза Журналистов России, Член Союза Журналистов Москвы, Стипендиат Правительства РФ, опыт работы в банках, коммерческих и государственных структурах (в т.ч.

Следственные действия: психология, тактика, технология

Книга посвящена правовым, психологическим и криминалистическим основам следственных действий как процессуальных способов доказывания по уголовным делам. Рассмотрены общая характеристика следственного действия, психологические условия и приёмы повышения их эффективности, даны рекомендации по подготовке и проведению отдельных видов основных следственных действий, регламентируемых ныне действующим УПК РФ.Для работников правоохранительных органов, студентов, аспирантов, докторантов, профессорско-преподавательского состава юридических учебных заведений.