Докато пишем всяка статия или документ, често имаме нужда някои знаци да бъдат в конкретни случаи. На уеб страница HTML елементът, чийто текст трябва да бъде трансформиран, се прилага със свойството CSS „ преобразуване на текст ”. Това свойство също спестява време по такъв начин, че след добавяне на всички знаци, регистърът им може да се трансформира наведнъж.

Тази публикация ще ви научи как можем да променим регистъра на буквите с CSS. И така, да започваме!

Как да пишем текст с главни и малки букви с помощта на CSS?

В CSS, „ преобразуване на текст ” свойството контролира главните букви на текста. Използва се и за преобразуване на текст в главни или малки букви.

text-transform Property Values

Възможните стойности на свойството CSS text-transform са изброени по-долу:

• • “ Главна буква ”: Тази стойност прави всички знаци в текста на елемента главни.
  • “ малка буква ”: Тази стойност променя текста на елемента на малки букви.
  • “ капитализирам ”: Тази стойност променя главната първа буква на всяка дума.
  • “ нито един ”: Тази стойност ограничава текста на елемента за промяна.
  • “ начален ”: Тази стойност задава стойността по подразбиране.
  • “ ти наследяваш ”: Тази стойност задава своята стойност от своя родителски елемент.

Анализирайте примера по-долу!

Пример: Трансформиране на текст в главни и малки букви

Първо добавете div елемент с името на класа „ кутия ”. Вътре в тялото добавете три заглавни тагова

,

и

, където текстът на заглавието

е изцяло с главни букви,

е с малки букви, а третият също е с малки букви.

По-долу е HTML кодът:

< див клас = 'кутия' >
< h1 > малки букви: ДОБРЕ ДОШЛИ В LINUXHINT h1 >
< h2 > главни букви: добре дошли в linuxhint h2 >
< h3 > капитализиране: добре дошли в linuxhint h3 >
див >

Стилна кутия div

.кутия {
височина: 200px;
ширина: 80 % ;
граница: плътна 4px #e4cfcf;
цвят на фона: cadetblue;
поле: 1px автоматично;
подложка: 10px;
}

Div, създаден в горния HTML файл, сега е стилизиран с CSS свойства, които са обяснени по-долу:

• • “ височина ” се използва за задаване на височината на div.
  • “ ширина ” се използва за задаване на ширината на div.
  • “ граница ” се използва за прилагане на рамката около елемента, която е с ширина 4px, тип плътна линия и цвят #e4cfcf.
  • “ Цвят на фона ” определя цвета на фона на елемента.
  • “ марж ” Свойството регулира пространството от всяка страна на елемента.
  • “ подплата ” се използва за създаване на пространство около съдържанието на елемента div или вътре в границата на елемента.

Кодовите блокове по-долу показват, че всички заглавни елементи са стилизирани с различни стойности на свойствата за преобразуване на текст. Елементът

се прилага със свойството text-transform със стойност, зададена като „ малка буква ”:

h1 {
преобразуване на текст: малки букви;
}

Елементът

се прилага със свойството text-transform със стойност, зададена като „ Главна буква ”:

h2 {
преобразуване на текст: главни букви;
}

За елемент

стойността на свойството text-transform е зададена като „ капитализирам ”:

h3 {
преобразуване на текст: капитализиране;
}

Чрез предоставяне на гореспоменатия код целият текст на първото заглавие се трансформира в малки букви, а на второто заглавие - в главни. Докато първата буква на всяка дума е главна в третото заглавие:

Страхотен! Успешно се научихме как да трансформираме текста в главни, малки букви и всички с главни букви.

Заключение

Свойството за преобразуване на текст на CSS контролира главните букви на текста и се използва за промяна на регистъра на буквите в текста на документа. Това свойство се прилага за всички елементи, където стойностите на това свойство могат да бъдат главни, малки, главни или никакви. Този блог обяснява процедурата за преобразуване на текст в главни и малки букви с помощта на свойството CSS text-transform.