วิธีเพิ่มช่องว่างภายในด้านเดียวใน Tailwind

ใน Tailwind CSS ช่องว่างภายในจะใช้เพื่อเพิ่มช่องว่างระหว่างเนื้อหาขององค์ประกอบเฉพาะและเส้นขอบ เพิ่มระยะห่างพิเศษภายในองค์ประกอบ Tailwind CSS มีชุดยูทิลิตี้การเติมและค่าการเติมที่อนุญาตให้ผู้ใช้ปรับแต่งระยะห่างขององค์ประกอบที่ต้องการ นอกจากนี้ ผู้ใช้สามารถเพิ่มช่องว่างภายในด้านเดียว เช่น ด้านบน ด้านล่าง ด้านซ้าย หรือด้านขวาขององค์ประกอบเฉพาะ

บล็อกนี้จะสาธิตตัวอย่างการเพิ่มช่องว่างด้านเดียวขององค์ประกอบใน Tailwind CSS

วิธีเพิ่มช่องว่างภายในด้านเดียวใน Tailwind

หากต้องการเพิ่มช่องว่างด้านเดียวขององค์ประกอบใน Tailwind คุณสามารถใช้คลาสยูทิลิตี้ต่อไปนี้ได้:

• • “ pt-<ค่า> ” คลาสเพิ่มช่องว่างภายในด้านบนขององค์ประกอบ
  • “ pb-<ค่า> ” คลาสเพิ่มการเติมที่ด้านล่างขององค์ประกอบ
  • “ pl-<ค่า> ” class เพิ่มช่องว่างทางด้านซ้ายขององค์ประกอบ
  • “ pr-<ค่า> ” class เพิ่มช่องว่างทางด้านขวาขององค์ประกอบ

เพื่อให้เข้าใจได้ดีขึ้น โปรดดูตัวอย่างด้านล่าง

ตัวอย่างที่ 1: เพิ่มช่องว่างภายในที่ด้านบนขององค์ประกอบ

ในตัวอย่างนี้ เราจะใช้ “ พ้อยท์-10 ” คลาสยูทิลิตี้ใน “