Cách đặt kiểu trang trí văn bản trong CSS Tailwind

Cach Dat Kieu Trang Tri Van Ban Trong Css Tailwind



Các trang web hấp dẫn người dùng thường yêu cầu nhiều phương pháp tạo kiểu được bổ sung theo thời gian. Trong những tình huống như vậy, kiểu dáng trang trí văn bản có thể được thực hiện theo nhiều cách dựa trên các giá trị khác nhau theo yêu cầu để làm cho trang web trở nên nổi bật.

Blog này sẽ bao gồm các lĩnh vực nội dung sau:







Làm cách nào để đặt kiểu trang trí văn bản trong CSS Tailwind?

Kiểu văn bản có thể được thiết lập và trang trí với sự trợ giúp của “ phong cách trang trí văn bản ” thuộc tính được phân bổ với các giá trị kiểu dáng khác nhau.



Thuộc tính kiểu trang trí văn bản



Lớp học Của cải
trang trí-rắn kiểu trang trí văn bản: rắn;
trang trí đôi kiểu trang trí văn bản: gấp đôi;
trang trí lượn sóng kiểu trang trí văn bản: lượn sóng;
nét trang trí kiểu trang trí văn bản: nét đứt;
trang trí rải rác kiểu trang trí văn bản: chấm;


Ví dụ: Đặt kiểu trang trí văn bản trong CSS Tailwind





Ví dụ này sử dụng “ phong cách trang trí văn bản ” thuộc tính với tất cả các giá trị để tạo kiểu cho văn bản đoạn văn:

DOCTYPE html >
< html >
< cái đầu >
< meta bộ ký tự = 'utf-8' >
< meta tên = 'khung nhìn' nội dung = 'width=chiều rộng thiết bị, tỷ lệ ban đầu=1' >
< kịch bản src = 'https://cdn.tailwindcss.com' > kịch bản >
cái đầu >
< thân hình >
< div >
< P lớp học = 'trang trí gạch chân-rắn ...' > Đây là trang web Linuxhint P >
< P lớp học = 'gạch chân trang trí-kép ...' > Đây là trang web Linuxhint P >
< P lớp học = 'trang trí gạch chân-lượn sóng ...' > Đây là trang web Linuxhint P >
< P lớp học = 'gạch chân trang trí-gạch ngang ...' > Đây là trang web Linuxhint P >
< P lớp học = 'gạch chân trang trí-chấm ...' > Đây là trang web Linuxhint P >
div >
thân hình >
html >


Dựa trên mã này, hãy áp dụng các bước sau:



    • Bao gồm “đã cho” CDN ” đường dẫn trong “ <đầu> ” để áp dụng các chức năng của Tailwind.
    • Bây giờ, hãy tạo bốn đoạn văn bằng cách sử dụng “

      Thẻ ” có chứa “ trang trí văn bản ” thuộc tính được gán với một giá trị khác nhau trong từng trường hợp, như đã thảo luận.

    • Kết quả là, điều này sẽ gạch chân văn bản bằng các đường nét liền, đôi, lượn sóng, nét đứt và chấm.

đầu ra


Từ kết quả này có thể khẳng định văn bản đã được trang trí phù hợp.

Phần kết luận

Kiểu văn bản có thể được thiết lập và trang trí với sự trợ giúp của “ phong cách trang trí văn bản ” thuộc tính được phân bổ với các giá trị kiểu dáng khác nhau. Các giá trị này bao gồm liền nét, đôi, lượn sóng, nét đứt và chấm. Blog này chủ yếu nói về việc thiết lập kiểu trang trí văn bản bằng CSS Tailwind.