KNOWLEDGE HYPERMARKET


Выравнивание текста. Полные уроки

Версия 10:03, 10 ноября 2010

Гипермаркет знаний>>Информатика>>Информатика 10 класс. Полные уроки>>Информатика: Выравнивание текста.


Тема: Выравнивание текста.

Цель: Научить форматировать текстовую информацию на веб-странице.


Для выравнивание текста на веб-странице используется уже известный тэг < p >.

Но сам процесс форматирования текста происходит не этим тэгом, а с помощью дополнительных команд (атрибутов) этого тэга:


  1. < p align="center" >текст< /p > - центрирование текста
  2. < p align="left" >текст< /p > - выравнивание текста по левому краю
  3. < p align="right" >текст< /p > - выравнивание текста по правому краю
  4. < p align="justify" >текст< /p > - выравнивание текстовой информации по обеим краям документа (веб-страницы).


В издательском деле выравнивание называется выключка – так правильней.

То есть, выключка по левому краю, по правому, по центру или по обеим сторонам.


К примеру, вот использование команды < p align="center" >:

< html >

< head >

< title>Мой первая страница< /title >

< /head >

< body >

< h1 >

< p align="center">Здравствуйте, это моя первая страница.< /p >

< /h1 >

< /body >

< /html >


Vir-1.jpg

А вот в этом примере выключка текста происходит по обеим сторонам, то есть с использованием атрибута «justify»:


Vir-2.jpg

Вот еще несколько слов касательно тэга < p >:

- не рекомендуется вводить в документ такую конструкцию - < p >< /p >. Причиной является то, что пустые тэги < p > (то есть, без текста или других атрибутов) просто-напросто игнорируются браузерами.

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

- после закрывающего тега < /p > происходит автоматический перенос строки.


Но если этот перенос не нужен, есть альтернативный тэг для выключек - < div >.


С этим тэгом можно использовать те же самые атрибуты, что и с < p >:

< div align="center"> текст < /div >

< div align="left"> текст < /div >

< div align="right"> текст < /div >

< div align="justify"> текст < /div >


Пример выключки по центру:


Vir-3.jpg

Итак, завершая этот урок подведем итоги и расскажем еще несколько замечаний по использованию тэгов для выключки текста:


1) Параграф не может содержать в себе другие параграфы (а также и тэг < div >).

То есть, такие варианты будут неверны и вводить их в документ нельзя:

< p align="right" >

< p >текст< /p >

< p >текст< /p >

< p >текст< /p >

< /p >

или

< p align="right" >

< div >текст< /div >

< p >текст< /p >

< div >текст< /div >

< /p >


2) Элемент < div > может содержать в себе параграфы. С помощью него можно сгруппировать их, например, по правому краю:

< div align="right" >

< p >текст первого абзаца< /p >

< p >текст второго абзаца< /p >

< p >текст третьего абзаца< /p >

< /div >





Вопросы:

1. Какие атрибуты используются для выравнивания текста?

2. Как можно выровнять текст по обеим сторонам?

3. Есть ли альтернатива тегу < p >?

4. Правила использования тэгов для выравнивания текста.


Список использованных источников:

1. Урок на тему: «Форматирование текста», Бурлаков А. С., г. Киев.

2. Квинт И. HTML и CSS на 100 %. - Питер, 2008 г.

3. Дуванов А.А Web-конструирование. HTML Основы информатики. - BHV-СПб, 2005 г.


Отредактировано и выслано преподавателем Киевского национального университета им. Тараса Шевченко Соловьевым М. С.


Если у вас есть исправления или предложения к данному уроку, напишите нам.

Если вы хотите увидеть другие корректировки и пожелания к урокам, смотрите здесь - Образовательный форум.

Предмети > Информатика > Информатика 10 класс