Your cart is currently empty!
วิธีการตกแต่งแท็ก hr ด้วย CSS
บางครั้งเราอยากให้แท็ก <hr> หน้าตาไม่เหมือนกับแบบทั่ว ๆ ไป เช่น ใส่สี เปลี่ยนความหนา
<hr> เกิดขึ้นมาจาก border เพราะฉะนั้นการตกแต่ง <hr> ทำได้ง่าย ๆ โดยกำหนด border: 0 เพื่อเอา style จากบราวเซอร์ออกก่อน แล้วสามารถตกแต่งได้เหมือน element ทั่ว ๆ ไปเลย
hr { height: 1px; color: #ed1d61; background: #ed1d61; font-size: 0; border: 0; }
สังเกตจากโค้ดข้างบนจะเห็นว่า <hr> ไม่ต้องกำหนด width: 100% เพราะเค้าเป็น display: block มาตั้งแต่กำเนิดนั่นเอง
ขอบคุณโค้ด CSS จาก Hugo และ Marwelln – Stackoverflow
by
Tags:
Leave a Reply