Самоучитель по HTML |
Справочник HTML |
Оглавление:
CSS
|
Свойства текстаДавайте рассмотрим некоторые параметры, предназначенные для работы с текстом. Например параметр line-height может задавать межстрочное расстояние в тексте. Расстояние указывается в пикселях. Например: <HTML> <HEAD> <TITLE>Свойства текста</TITLE> </HEAD> <BODY> <center><h1>Параметр <b>line-height</b></h1></center> <P style="line-height:100px">Первая строка</P> <P>Вторая строка</P> </BODY> </HTML>
Другой параметр text-decoration со значением underline подчёркивает текст, со значением overline рисует линию над текстом, значение line-through перечёркивает текст, а blink создаёт эффект мерцания. Правда этот эффект у меня сработал только в Opere (версии 9.24). А вот Internet Explorer (седьмой версии) отказался производить данный эффект... Итак, рассмотрим пример: <HTML> <HEAD> <TITLE>Свойства текста</TITLE> </HEAD> <BODY> <center><h1>Параметр text-decoration</h1></center> <P style="text-decoration: underline">Первая строка</P> <P style="text-decoration: overline">Вторая строка</P> <P style="text-decoration: line-through">Третья строка</P> <P style="text-decoration: none">Четвёртая строка</P> </BODY> </HTML>
Следующий параметр text-transform предназначен для преобразования символов текста. Его значения: capitalize - первая буква каждого слова будет прописаной, а все остальные строчные; uppercase - делает буквы прописными; lowercase - буквы преобразуются в строчные; none - отсутствие преобразований. Например: <HTML> <HEAD> <TITLE>Свойства текста</TITLE> </HEAD> <BODY> <center><h1>Параметр text-transform</h1></center> <P style="text-transform: capitalize">Первая буква каждого слова становится прописной.</P> <P style="text-transform: uppercase">Все буквы становятся прописными.</P> <P style="text-transform: lowercase">Буквы Cтановятся СТРОЧНЫМИ</P> <P style="text-transform: none">Отсутствие преобразований</P> </BODY> </HTML>
Ещё один параметр свойства текста, это text-align. Он выравнивает текст. Со значением left выравнивает текст по левому краю, со значением right по правому краю, со значением center по центру, со значением justify по ширине (то есть края текста будут ровными). <HTML> <HEAD> <TITLE>Свойства текста</TITLE> </HEAD> <BODY> <center><h1>Параметр text-align</h1></center> <P style="text-align: left">Выравнивает текст по левому краю</P> <P style="text-align: right">Этот текст выравнен по правому краю</P> <P style="text-align: center">Данный текст будет центрирован</P> <P style="text-align: justify">А этот текст будет выравнен по ширине. То есть края текста будут ровные, что позволит улучшить внешний вид Web-страницы и тем самым оставить хорошее впечатление у посетителей вашего сайта. Данный тег лучше использовать почаще ;)</P> </BODY> </HTML> Ну и последний параметр в этой главе, это text-indent. Отвечает за отступ первой строки абзаца от левого края. Значения можно задавать как просто в единицах изменения (в пикселях), так и в процентах. Предыдущая страница Следующая страница Вы можете свободно использовать фрагменты сайта, с условием размещения ссылки на наш сайт: <a href="http://tri222.narod.ru"><b>Самоучитель по созданию Web-страниц.</b></a> Copyright © 2008 "tri222.narod.ru" |