Въведение в CSS форматирането на текст
В предишните дни бяхте ограничени да представяте текста, като използвате старата версия на CSS. Трябваше да маркирате, за да промените засенчването и шрифта на съдържанието, но измерването беше възпрепятствано чрез предварително охарактеризираните текстови размери. Различните въздействия като интензивност и пробив са възможни само в основни структури с помощта на HTML етикети. В момента потребителят може да използва различни свойства за форматиране на CSS текст, за да подреди текста на уеб страниците по неговите начини.
В тази глава ще видите множество свойства за форматиране на CSS текст. Свойствата за форматиране на CSS текст се използват за проектиране на текст, оформяне на текста, описание на няколко стила за форматиране и др. Свойствата ви предоставят визуално представяне на символите, интервалите, думите, абзаците и много други.
Списък на свойствата за форматиране на CSS текст:
Подробности за начините за форматиране на текст в CSS: -
1) Цвят на текста
Това свойство може да се използва за промяна на цвета на текста. Той може да бъде определен чрез използване на свойство цвят.
Пример : Илюстрация на цвета на текста
CSS Text Color Property
Здравей свят….
Приветствайте EDUCBA …
Той ще покаже следния изход:
2) Подравняване на текст
Това свойство може да се използва за промяна на хоризонталата на текста. Тя може да бъде дефинирана чрез използване на свойства наляво, надясно, в центъра, да се оправдае.
Пример : Илюстрация на подравняване на текст
Text Alignment Property
Здравей свят…
Добре дошли в EDUCBA …
Образователен консултант …
Той ще покаже следния изход:
3) Декорация на текст
Това свойство може да се използва за украса на текста. Тя може да бъде дефинирана чрез използване на подчертаване, подчертаване, преходни линии.
Пример : Илюстрация на текстова украса
Text DecorationProperty
Здравей свят…
Добре дошли в EDUCBA …
Образователен консултант …
Той ще покаже следния изход:
4) Трансформация на текст
Това свойство може да се използва за промяна на случаите на текста. Тя може да бъде дефинирана чрез използване на главни и малки букви.
Пример : Илюстрация на трансформация на текст
Text Transformation Property
Здравей свят…
Добре дошли в educba …
Образователен консултант …
Той ще покаже следния изход:
5) Текстови отстъп
Това свойство може да се използва за отстъп на първия ред на текста. Той може да бъде определен чрез използване на px, cm, pt свойства.
Пример : Илюстрация на отстъп на текста
Text Indentation Property
Здравей свят…
Добре дошли в Educba …
Образователен консултант …
Той ще покаже следния изход:
6) Разстояние между думите
Това свойство може да се използва за предоставяне на интервал между думите. Тя може да бъде дефинирана чрез използване на свойството за разделяне на думи.
Пример : Илюстрация на разстоянието между думи
Word Spacing Property
Здравей свят…
Добре дошли в Educba …
Образователен консултант …
Той ще покаже следния изход:
7) Разстояние между буквите
Това свойство може да се използва за предоставяне на интервал между знаците. Тя може да бъде дефинирана с помощта на свойството на разстояние по букви.
Пример : Илюстрация на разстоянието между букви
Letter Spacing Property
Здравей свят…
Добре дошли в Educba …
Образователен консултант …
Той ще покаже следния изход:
8) Височина на линията
Това свойство може да се използва за предоставяне на пространство между редовете. Тя може да бъде дефинирана чрез използване на свойство на височина на линията.
Пример : Илюстрация на височината на линията
Line Height Property
h3
(
line-height:2.5;
)
h4
(
line-height:150%;
)
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) е a
водещ световен доставчик на обучение, основано на умения
В eduCBA за нас е гордост да направим работа ориентирана
практически курсове, достъпни за всеки, по всяко време и навсякъде.
Той ще покаже следния изход:
9) Текст посока
Това свойство може да се използва за промяна на посоката на текста. Тя може да бъде дефинирана чрез използване на свойство rtl. Задава посока отдясно на ляво.
Пример : Илюстрация на посоката на текста
Text Direction Property
Здравей, Свят … Добре дошли в Educba …
Той ще покаже следния изход:
10) Текст-сянка
Това свойство може да се използва за даване на сянка за текста. Тя може да бъде определена с помощта на свойството text-shadow. Той използва компоненти като ляво положение, горно положение, размер на размазването, име на цвят.
Пример : Илюстрация на текст-сянка
Text Shadow Property
h3
(
text-shadow:3px 3px 2px lightblue;
)
h4
(
text-shadow:3px 3px 2px plum;
)
Здравей, Свят … Добре дошли в EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) е образование, основано на умения
Той ще покаже следния изход:
11) Ems
Това е мащабируема единица за оразмеряване. Това свойство em може да се използва за определяне на размера на текста според заобикалящия го текст. Основният размер на текста е 1em, което е равно на 12pt. 2em е равно на 24pt и така нататък.
Пример : Илюстрация на свойство ems
Ems Property
h3
(
font-size: 0.8em;
)
h4
(
font-size: 1.2em;
)
Здравей, Свят … Добре дошли в EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) е образование, основано на умения
Той ще покаже следния изход:
12) Семейство шрифтове
Това свойство се използва за предоставяне на различни видове имена на семейства шрифтове за избрания текст. Например Helvetica, Calibri, Arial, Sans-serif, Times, Courier New и т.н.
Пример : Илюстрация на свойството семейство на шрифтове
Font Family Property
Здравей свят…
Добре дошли в Educba …
Образователен консултант …
Той ще покаже следния изход:
заключение
Досега проучихме за начините за форматиране на текст в CSS. Можете да видите, че текстът е представен с различни видове свойства за форматиране на текст. Тези свойства са много важни аспекти на CSS за показване на текста на уеб страницата, така че потребителите или читателите да могат да бъдат привлечени, като видят вашия текст на уебсайта. Използвайте тези свойства на текста много лесно и ефективно на уеб страниците.
Препоръчителни статии
Това е ръководство за CSS форматиране на текст. Тук сме обсъдили подробно въведение и списък на свойствата за форматиране на CSS текст с примерните кодови примери и правилното извеждане. Можете да разгледате и другите ни предложени статии, за да научите повече -
- Какво е CSS?
- SASS срещу CSS
- CSS команди
- CSS3 Въпроси за интервю