Теги для форматирования текста

Теги форматирования текста       Для чего нужны теги для форматирования текста? И для чего вообще нужно форматировать текст? Все очень просто. При создании сайта, а вернее его составляющей — html-страницы, необходимо, иногда, на что то обратить внимание посетителей сайта, где то подчеркнуть, что то зачеркнуть, выделить основную мысль страницы и так далее.

       Здесь мы с тобой рассмотрим основные теги, с помощью которых, возможно все выше сказанное воплотить в жизнь.


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

       Для создания абзаца существует тег P, это парный тег —  <P>….</P>, закрывающий элемент </P> можно не прописывать, так как по умолчанию браузер считает, что начало следующего абзаца автоматически приводит к окончанию предыдущего. Хотя желательно делать все по правилам. Рассмотрим не большой пример:

<HTML>
<HEAD>
<TITLE>
Форматирование текста
</TITLE>
</HEAD>
<BODY>
Разрыв текста<BR>в данных местах<BR>с помощью тегаBR

<P>Пример первого абзаца.</P> <P>Пример второго абзаца.</p>
</BODY>
</HTML>

       С помощью текстового редактора просматриваем, что у нас получилось:

Пример форматирование текста

       Идем дальше. Самыми распространенными тегами для форматирования текста являются:

<B></B> — тег полужирного начертания текста. В последнее время рекомендуют применять аналогичный тег <STRONG></STRONG>
<I></I> — текст с курсивным написанием. Так же, сейчас, применяют тег <EM></EM>
<U></U> — текст будет подчеркнут.
<STRIKE></STRIKE> — здесь сам текст будет, перечеркнут.
<BIG></BIG> — увеличенный текст.
<SMALL></SMALL> — уменьшенный текст.
<SUP></SUP> — это верхний индекс. Например, для записи числа в квадрате.
<SUB></SUB> — а это уже нижний индекс. Пример — химическая формула.

       Возьмем простой пример:

<HTML>

<HEAD>
<TITLE> Пример форматирования текста </TITLE>
</HEAD>

<BODY>
<B> тег полужирного начертания текста</B><BR>
<I> текст с курсивным начертанием. Так же, сейчас, применяют тег < EM>< /EM></I><BR>
<U> текст будет подчеркнут</U><BR>
<STRIKE> сам текст будет, перечеркнут</STRIKE><BR>
<BIG> увеличенный текст</BIG><BR>
<SMALL> уменьшенный текст</SMALL><BR>
<SUP> верхний индекс</SUP> простой текст <SUB> нижний индекс</SUB><BR>

</BODY>

</HTML>

        Посмотрим, что у нас вышло:

Теги форматирования

       Для выравнивания текста на странице, применяют атрибут align. Он имеет несколько значений: center, left, right и justify. Что означает, соответственно: по центру, слева, справа и по двум краям одновременно. Например:

<p align=»center»>Текст выводится по центру</p>

       В браузере ты увидишь:

Текст выводится по центру

       С остальными значениями, соответственно, текст будет выводиться в заданных критериях.
       Так же есть возможность визуального разделения текста. За это отвечает тег <HR>. Этот тег создает на странице разделительную полосу и имеет следующие атрибуты:

 
align — выравнивание по странице
size — толщина полосы
color — цвет полосы
width — ширина полосы
noshade — этот атрибут не имеет значения. Если его указывают, то по умолчанию создается сплошная черная полоса. Например, создадим оранжевую полосу по центру:
 
 <HTML>
 
<HEAD>
<TITLE> Создаем разделительную полосу</TITLE>
</HEAD>
 
<BODY>

<hr align=»center» size=»7″ width=»40%» color=»##FF8000″>

</BODY>

</HTML>

       Смотрим, что из этого вышло:

 С помошью тегов создаем разделительную полосу

        Всё это сразу, конечно, выучить тебе будет нелегко. Да ты и не пытайся. Просто попробуй раз другой написать код ручками. Это куда эффективнее, чем просто прочитать. Ну а впоследствии всегда сможешь вернуться к этому материалу и пройтись еще раз, если на то будет необходимость. Идем дальше.

 

                Вернутся к содержанию                    К предыдущей главе                 Продолжить изучение

 

Понравилась страничка? Поделись в соц. сетях

Опубликовать в Google Buzz
Опубликовать в Google Plus
Опубликовать в LiveJournal
Опубликовать в Мой Мир
Опубликовать в Одноклассники
Опубликовать в Яндекс
регистрация доменов

Интерестное

ad