Bootstrap CSS Class-Success

Bootstrap CSS Class-Success

Zajęcia kolorów bootstrap zapewniły programistom z łatwością. Klasy te są nie tylko dodawane przy użyciu nazwy klasy, ale także przekazywania znaczenia użytkownikowi, na przykład pokazanie komunikatu o błędzie, „Niebezpieczeństwo tekstowe„Klasa jest używana. Podobnie „„ „Sukcencja tekstu„Klasa może być wykorzystywana do wyświetlania niektórych komunikatów sukcesu związanych z przesłaniem formularza lub więcej.

Ten post omówi:

  • Co to jest klasa Bootstrap CSS „Sukces tekstowy”?
  • Jak dodać klasę „rozstrzygnięcie tekstu” do elementu HTML?

Co to jest klasa Bootstrap CSS „Sukces tekstowy”?

„„Sukcencja tekstu„Klasa stosuje zieloną do tekstu elementu. Ta klasa jest zwykle dodawana do elementów mających komunikaty sukcesu, takie jak „Dobra robota!", "Powodzenie!", "Dobra robota!" i wiele więcej.

Jak dodać klasę „rozstrzygnięcie tekstu” do elementu HTML?

Dodajmy „Sukcencja tekstu„Klasa do HTML”

  • Najpierw dodaj „„Element o„Rect”,„M-Auto”,„Center wyrównania", I "Justify-Content-Center„Zajęcia.
  • Wewnątrz tego „” dodaj „

    ”Tag, aby określić jakiś tekst. Ten tag jest dodawany za pomocą „czcionek-rozładowani" I "Sukcencja tekstu„Zajęcia.

Oto kod HTML:


Dobrze zrobiony!


Można zauważyć, że zielony kolor został pomyślnie zastosowany do elementu akapitu:

Teraz dodajmy kilka CSS, aby stylizować „” o „Rect" klasa.

Style „Rect” klasa

.Rect
kolor tła: RGB (197, 232, 195);
szerokość: 200px;
Wysokość: 60px;
RADIUS BERDER: 15px;
granica: 1px Solid RGB (191, 226, 166);
Box-shadow: 1px 1px 1px 1px Gray;

Do klasy zastosowano następujące omawiane właściwości „Rect”:

  • "kolor tła„Zmienia kolor tła elementu.
  • "szerokość" I "wysokość”Są wykorzystywane do ustawienia obszaru elementu.
  • "Radiusz graniczny„Właściwość nadaje krawędzi elementu zaokrąglony wygląd.
  • "granica”Dodaje granicę wokół wszystkich krawędzi elementu.
  • "Shadow Box”Dodaje efekt cienia do elementu.

Style „P”

Element akapitu jest stylizowany w następujący sposób:

.Rect P
Rozmiar czcionki: 25px;
odstępy między literami: .2em;

Tutaj:

  • "rozmiar czcionki”Dostosowuje rozmiar czcionki.
  • "odstępy między literami”Jest wykorzystywany do dodawania przestrzeni między literami.

Wyjście

W ten sposób możesz użyć bootstrap ”Sukcencja tekstu„Klasa w Twojej witrynie lub aplikacji internetowej.

Wniosek

Aby przedstawić wiadomość sukcesu w naszej aplikacji, bootstrap „Sukcencja tekstu„Klasa jest wykorzystywana. Ta klasa zapewnia tekst „#28a745”(Jasnozielony) kolor. Aby go wykorzystać, dodaj „Sukcencja tekstu„Klasa do elementu HTML, do którego chcesz dodać zielony kolor. Ten zapis wyjaśnił klasę „Sekt tekstu” z pomocą przykładów.