В сегодняшней статья я Вас познакомлю с различными способами форматирования текста. Совершенно
очевидно, что было бы очень скучно, если бы везде был однообразный
текст: одного размера, одного шрифта, одного цвета, одного вида. Поэтому
среди HTML тегов имеются различные теги, позволяющие задать определённый внешний вид текста. Давайте,
для начала разберёмся с начальными данными, если можно так выразиться, а
именно со страницей, которая у нас имеется. Пусть она будет такой: 
<html>
<head>
</head>
<body text = "green" bgcolor = "yellow">
<h1>Заголовок 1-го уровня</h1>
</body>
</html>Собственно, здесь уже имеются элементы форматирования: тег <h1>,
который делает текст внутри тега крупным, более того, это идёт, как
заголовок, поэтому дальнейшие элементы располагаются уже под ним. Также
мы здесь задали цвет текста (green) в атрибуте text тега <body>. Теперь поговорим о других возможностях по форматированию текста. Первое, что можно сделать - это узнать, как сделать различный вид текста: курсив, подчёркнутый, жирный и различные комбинации. Начнём с курсива. Текст будет курсивным, если он находится внутри тега <i>. Поэтому давайте напишем так: <i>Это курсив</i>Если Вы запустите браузер, то Вы сможете увидеть текст в виде курсива. Также текст может быть жирным. Делается это с помощью тега <b>. Например, так: <b>Это жирное начертание</b>Также текст можно сделать подчёркнутым. Для этого необходимо использовать тег <u>. <u>Подчёркнутый текст</u>Помимо этого можно сделать текст, например, курсивным и жирным. Делается это следующий образом: <i><b>Жирный курсивный текст</b></i>Также можно записать и так: <b><i>Жирный курсивный текст</b></i>Если
Вы посмотрите в браузере, то не увидите никакой разницы. Это и логично,
ведь какая разница: сначала сделали текст курсивным, а потом жирным,
или, наоборот, сначала жирным, а потом курсивным. Суть, думаю, понятна.
Единственное правило, но ОЧЕНЬ важное правило - это соблюдать принцип вложенности. То есть сначала закрываются все внутренние теги, и только потом закрываются внешние теги. Таким образом, НЕЛЬЗЯ писать так: <i><b>Жирный курсивный текст</i></b>Думаю, понятно, что работать это не будет. Ведь мы не закрыли ещё тег <b>, а уже закрываем тег <i>. Всегда помните о принципе вложенности - это одно из немногих правил HTML, соблюдение которого обязательно! Теперь поговорим о размере шрифта текста. Изменить размер текста можно с помощью тега <font>, а, точнее, с помощью его атрибута "size", значение которого и означает размер шрифта. Давайте перейдём на следующую строку с помощью тега <br> и напишем такую строчку: <font size = "5">Это текст c size = "5"</font>Обновив страницу в браузере, Вы увидите, что текст стал крупнее, чем раньше. Это и сделал атрибут "size" тега <font>. Чем больше значение атрибута "size", тем крупнее шрифт, впрочем, думаю, что Вам это очевидно. Цвет текста можно задавать также с помощью тега <font>, так как у этого тега имеется ещё один атрибут - "color". Значение данного атрибута может быть любой цвет. Давайте напишем так: <font size = "5" color = "red">Это увеличенный красный текст</font>Вот это и были основные способы по изменению внешнего вида текста. Напоследок,
напишем строчку, в которой намешано абсолютно всё, что мы сегодня
узнали. Сначала, правда, давайте перейдём на следующую строку, с помощью
уже знакомого нам тега <br>. Обратите внимание, что необходимо соблюдать принцип вложенности: пока не закрыт внутренний тег - внешний не закрывается. <font size = "4" color = "navy">
<b>
<i>
<u>Это текст, в котором намешано очень многое</u>
</i>
</b>
</font>
Таким образом, код нашей страницы стал таким: <html>
<head>
</head>
<body text = "green" bgcolor = "yellow">
<h1>Заголовок 1-го уровня</h1>
<i>Это курсив</i>
<b>Это жирное начертание</b>
<u>Подчёркнутый текст</u>
<i>
<b>Жирный курсивный текст</b>
</i>
<b>
<i>Жирный курсивный текст</b>
</i>
<br>
<font size = "5">Это текст c size = "5"</font>
<font size = "5" color = "red">Это увеличенный красный текст</font>
<br>
<font size = "4" color = "navy">
<b>
<i>
<u>Это текст, в котором намешано очень многое</u>
</i>
</b>
</font>
</body>
</html>Вот и вся наука. Как видите, снова ничего сложного не было, и это неудивительно, ведь это основные знания по HTML, которыми обладает любой уважающий себя Web-мастер. Без этих знаний речи о создании сайтов и идти даже не может. Всего Вам доброго, увидимся в следующей статье. С уважением, Михаил Русаков
Источник: http://rahman. html | 
Каталог статей 