Този текст е стилизиран с някои от пропъртитата за стилизиране на текст. За заглавието се използва text-align, text-transform, и пропърти за цветове. Параграфа започва с разстояние навътре, изравнен е, и разстоянието между символите е определено. Подчертаващата линия е премахната от връзката. „Опитайте сами“
Text-color
Пропъртито text-color се използва за определяне цвета на текста. Както споменахме в предната глава, цвета се определя като:
- шестнадесетична стойност – пример „# ff0000“
- RGB стойност – пример „RGB (255,0,0)“
- вписване на името на цвета – пример „red“
Погледнете CSS цветови стойности за пълен списък на възможните цветови стойности.
В селектора body, можем да определим цвета на текста на целия елемент.
Забележка: Подбирайте цвета на текста и цвета на фона, така че да са съвместими.
text-alignment
Това пропърти се използва за хоризонталното подравняване на текста. Текстът може да е центриран, подравнен от лято, от дясно или justified.
Когато се избере justified, всеки ред от текста се разтяга за да има еднаква ширина и е подравнен от ляво и дясно (както при вестниците и списанията).
text-decoration
text-decoration пропъртито се използва за декорация и украсяване на текста. Най-честата употреба е за добавяне или премахване на подчертаващи линии от хипервръзките:
Може също да се използва за украса на текст:
Забележка: Не е хубаво да се подчертава текст, който не е HTML връзка, защото това може да обърка потребителя. Ако искате да „натъртите“ определена част от текста, използвайте други методи за стилизиране.
text-transformation
text-transformation се използва за промяна на главни и малки букви в текста. Може да направи всички букви главни или малки, а също така и да направи всички първи букви на думите – главни.
Text Indentation
Пропъртито text-indent се използва за определяне отстъпа на всеки първи ред от параграф.
Разстояние между символите
Примера показва как се увеличава разстоянието между отделните букви или символи.
Разстояние между редовете
Как се определя разстоянието между редовете в един текст.
Посоката на текста
Как да определим посоката на текста в дадем елемент.
Увеличаване на пространството между думите
Как да увеличим пространството между думите в даден абзац.
Как да изключим комплектоването на текста
Как да изключим комплектоването на текста, така че той да не се форматира от размера на страницата.
Вертикално подравняване на изображението
Как да подравним вертикално, Добавяне на сянка към текст
Този пример показва как да добавим сянка към текст.
Всички CSS текстови Пропъртита
| Пропърти | Описание |
|---|---|
| color | Определя цвета на текста |
| direction | Определя посоката на писане на текста |
| letter-spacing | Определя разстоянието между символите в текста |
| line-height | Височината на редовете |
| text-align | Хоризонталното подравняване на текста |
| text-decoration | Определя декорацията на текста |
| text-indent | Определя колко навътре ще започне първия ред от всеки абзац |
| text-shadow | Дефинира сянката на текста |
| text-transform | Превръща малките букви в главни и обратно |
| unicode-bidi | Използва се заедно със direction пропъртито за да помогне за поддръжката на няколко езика за една страница |
| vertical-align | Определя вертикалното подравняване |
| white-space | Определя празното пространство вътре в даден елемент |
| word-spacing | Увеличава или намалява разстоянието между думите |