Przykład transformacji tekstu bootstrap

Podczas tworzenia dowolnej aplikacji tekst musi być prosty i zrozumiały dla użytkowników. Przypadki tekstowe mogą również wpływać na wygląd aplikacji. „„Tekst-transform„Własność w CSS jest wykorzystywana do określenia, w jaki sposób tekst można liczyć. Może sprawić, że cały tekst w wielkich lub małej litery lub sprawić, że pierwsza litera każdego słowa jest skapitalizowana. Mówiąc dokładniej, istnieją klasy w bootstrapie, które wykonują wyżej wymienione zadanie.

Ten zapis będzie opisany:

• Czym jest właściwość Bootstrap „Transform”?
• Jak konwertować tekst w wielkim poziomie za pomocą bootstrap?
• Jak wykorzystać pierwszą postać tekstu za pomocą bootstrap?
• Jak przekształcić tekst w małej litery za pomocą bootstrap?

Czym jest właściwość Bootstrap „Transform”?

W bootstrapie „tekst-*„Klasy są wykorzystywane do przekształcenia tekstu, w którym„*”Wskazuje wartości„skapitalizować”,„duże litery", I "małe litery". Wartości te są odpowiednio używane.

Aby uzyskać praktyczną demonstrację, przejrzyj poniżej wyświetlone sekcje.

Metoda 1: Jak konwertować tekst w wieloletnich za pomocą bootstrap?

Bootstrap „Podstawa tekstowa”Klasa jest wykorzystywana do przekształcania każdej litery w wielki poziom. Ta klasa ma predefiniowany styl, w którym „Tekst-transform„Własność CSS jest ustawiona o wartości”duże litery".

Przykład

Najpierw dodaj link do plików bootstrap w sekcji głównej pliku HTML za pomocą „

”Element w pliku i przypisz go„Podstawa tekstowa" klasa.

Html

klasa bootstrap „Tekst-Upper”

Można zaobserwować, że dodany tekst został przekształcony w wszystkie wielkie oceny:

Metoda 2: Jak wykorzystać pierwszy znak każdego słowa za pomocą bootstrap?

Bootstrap „Kapitalizowanie tekstu„Klasa tworzy pierwszą kapitał postaci każdego słowa. Ta klasa ma predefiniowany styl, w którym „Tekst-transform„Własność ma wartość”skapitalizować".

Przykład

Dodać "

”Element w pliku HTML i przypisz go„Kapitalizowanie tekstu" klasa.

Html

klasa bootstrap „Capitalize”

Wyjście

Metoda 3: Jak przekształcić tekst w małej litery za pomocą bootstrap?

Bootstrap „Tekst-Lowercase„Klasa konwertuje każdą literę w małe litery. Ta klasa ma predefiniowany styl, w którym CSS ”Tekst-transform„Właściwość jest ustawiona o wartości”małe litery".

Dodać "

”Element w pliku HTML i przypisz go„Tekst-Lowercase" klasa.

Html

BOOTSTRAP „Tekst-Lower” Class

Wyjście

Chodziło o przekształcenie tekstu w bootstrapie.

Wniosek

W bootstrapie transformacja tekstu odbywa się za pomocą „Kapitalizowanie tekstu”,„Podstawa tekstowa", I "Tekst-Lowercase„Zajęcia. Aby to zrobić, najpierw dodaj tekst do pliku HTML, a następnie przypisz element z żądaną klasą zgodnie z potrzebami. Ten post wyjaśnił za pomocą przykładów, jak przekształcić tekst w bootstrapie.