Strony internetowe atrakcyjne dla użytkowników często wymagają od czasu do czasu dodania wielu metod stylizacji. W takich sytuacjach stylizację dekoracji tekstu można przeprowadzić na wiele sposobów w oparciu o różne wartości, zgodnie z wymaganiami, aby witryna wyróżniała się.
Ten blog będzie dotyczył następujących obszarów treści:
Jak ustawić styl dekoracji tekstu w CSS Tailwind?
Styl tekstu można ustawić i ozdobić za pomocą opcji „ styl dekoracji tekstu ” nieruchomość o różnych walorach stylistycznych.
Właściwości stylu dekoracji tekstu
| Klasa | Nieruchomości |
| dekoracja-solidna | styl dekoracji tekstu: solidny; |
| dekoracja-podwójna | styl dekoracji tekstu: podwójny; |
| dekoracja-falista | styl dekoracji tekstu: falisty; |
| dekoracja-przerywana | styl-dekoracji tekstu: przerywany; |
| Ozdobne kropki | styl dekoracji tekstu: kropkowany; |
Przykład: ustawianie stylu dekoracji tekstu w CSS Tailwind
W tym przykładzie wykorzystano omówione powyżej „ styl dekoracji tekstu ” ze wszystkimi wartościami stylizującymi tekst akapitu:
DOCTYPEhtml >< HTML >
< głowa >
< meta zestaw znaków = „utf-8” >
< meta nazwa = „widok” treść = „szerokość=szerokość-urządzenia, skala-początkowa=1” >
< scenariusz źródło = „https://cdn.tailwindcss.com” > scenariusz >
głowa >
< ciało >
< div >
< P klasa = 'podkreśl dekorację-solidną...' > To jest witryna Linuxhint P >
< P klasa = 'podkreśl dekorację-podwójną...' > To jest witryna Linuxhint P >
< P klasa = 'podkreśl dekorację-falistą...' > To jest witryna Linuxhint P >
< P klasa = 'podkreśl dekorację przerywaną...' > To jest witryna Linuxhint P >
< P klasa = 'podkreśl dekorację w kropki...' > To jest witryna Linuxhint P >
div >
ciało >
HTML >
W oparciu o ten kod wykonaj następujące kroki:
-
- Uwzględnij podane „ CDN ”ścieżka w obrębie”
”, aby zastosować funkcje Tailwind. - Teraz utwórz cztery akapity, używając „ ”znacznik zawierający „ dekoracja tekstowa ” właściwość ma w każdym przypadku przypisaną inną wartość, jak omówiono.
- W efekcie tekst zostaje podkreślony liniami ciągłymi, podwójnymi, falistymi, przerywanymi i kropkowanymi.
- Uwzględnij podane „ CDN ”ścieżka w obrębie”
Wyjście
Na podstawie tego wyniku weryfikuje się, czy tekst został odpowiednio udekorowany.
Wniosek
Styl tekstu można ustawić i ozdobić za pomocą opcji „ styl dekoracji tekstu ” nieruchomość o różnych walorach stylistycznych. Wartości te obejmują kolor pełny, podwójny, falisty, przerywany i kropkowany. Ten blog dotyczył ustawiania stylu dekoracji tekstu za pomocą CSS Tailwind.