เว็บไซต์ที่ดึงดูดใจผู้ใช้มักจะต้องมีการต่อท้ายวิธีการจัดรูปแบบหลายวิธีเป็นครั้งคราว ในสถานการณ์เช่นนี้ การจัดสไตล์การตกแต่งข้อความสามารถทำได้หลายวิธีโดยขึ้นอยู่กับค่าที่แตกต่างกันตามความต้องการเพื่อทำให้ไซต์โดดเด่น
บล็อกนี้จะครอบคลุมเนื้อหาต่อไปนี้:
วิธีการตั้งค่าสไตล์การตกแต่งข้อความใน Tailwind CSS
สามารถตั้งค่าและตกแต่งรูปแบบข้อความได้โดยใช้ปุ่ม “ สไตล์การตกแต่งข้อความ ” คุณสมบัติที่ได้รับการจัดสรรด้วยค่าสไตล์ที่แตกต่างกัน
คุณสมบัติสไตล์การตกแต่งข้อความ
ระดับ | คุณสมบัติ |
ตกแต่งแข็ง | สไตล์การตกแต่งข้อความ: ทึบ; |
ตกแต่ง-คู่ | รูปแบบการตกแต่งข้อความ: double; |
ตกแต่งหยัก | สไตล์การตกแต่งข้อความ: หยัก; |
ตกแต่งประ | สไตล์การตกแต่งข้อความ: ประ; |
ตกแต่งประ | สไตล์การตกแต่งข้อความ: ประ; |
ตัวอย่าง: การตั้งค่ารูปแบบการตกแต่งข้อความใน Tailwind CSS
ตัวอย่างนี้ใช้สิ่งที่กล่าวถึงข้างต้น “ สไตล์การตกแต่งข้อความ ” คุณสมบัติที่มีค่าทั้งหมดเพื่อจัดรูปแบบข้อความย่อหน้า:
DOCTYPE html >< html >
< ศีรษะ >
< เมตาดาต้า ชุดอักขระ = 'utf-8' >
< เมตาดาต้า ชื่อ = 'วิวพอร์ต' เนื้อหา = 'ความกว้าง=ความกว้างของอุปกรณ์, ขนาดเริ่มต้น=1' >
< สคริปต์ src = 'https://cdn.tailwindcss.com' > สคริปต์ >
ศีรษะ >
< ร่างกาย >
< กอง >
< พี ระดับ = 'ขีดเส้นใต้การตกแต่ง-ทึบ ...' > นี่คือเว็บไซต์ Linuxhint พี >
< พี ระดับ = “ขีดเส้นใต้ ตกแต่ง-คู่ …” > นี่คือเว็บไซต์ Linuxhint พี >
< พี ระดับ = “ขีดเส้นใต้ ตกแต่ง-หยัก …” > นี่คือเว็บไซต์ Linuxhint พี >
< พี ระดับ = 'ขีดเส้นใต้ตกแต่ง-ประ ...' > นี่คือเว็บไซต์ Linuxhint พี >
< พี ระดับ = “ขีดเส้นใต้ ตกแต่ง-ลายจุด …” > นี่คือเว็บไซต์ Linuxhint พี >
กอง >
ร่างกาย >
html >
ตามรหัสนี้ ใช้ขั้นตอนต่อไปนี้:
-
- รวมถึงสิ่งที่กำหนดให้ “ ซีดีเอ็น ” เส้นทางภายใน “ <หัว> ” เพื่อใช้ฟังก์ชัน Tailwind
- ตอนนี้ สร้างสี่ย่อหน้าโดยใช้เครื่องหมาย “ ” แท็กที่มี “ การตกแต่งข้อความ ” ทรัพย์สินที่ได้รับมอบหมายด้วยมูลค่าที่แตกต่างกันไปในแต่ละกรณี ตามที่กล่าวไว้
- ซึ่งจะเป็นการขีดเส้นใต้ข้อความด้วยเส้นทึบ เส้นคู่ เส้นหยัก เส้นประ และเส้นประ
เอาท์พุต
จากผลลัพธ์นี้จึงได้รับการยืนยันว่าข้อความได้รับการตกแต่งตามนั้น
บทสรุป
สามารถตั้งค่าและตกแต่งรูปแบบข้อความได้โดยใช้ปุ่ม “ สไตล์การตกแต่งข้อความ ” คุณสมบัติที่ได้รับการจัดสรรด้วยค่าสไตล์ที่แตกต่างกัน ค่าเหล่านี้ได้แก่ ทึบ สองเท่า หยัก ประ และจุด บล็อกนี้มีเนื้อหาเกี่ยวกับการตั้งค่ารูปแบบการตกแต่งข้อความโดยใช้ Tailwind CSS