Devdit
 

CSS ul li เมนูแนวนอน ข้อมูลแนวนอน ด้วย inline-block

1.6K

สอนภาษา CSS ul li สร้างเมนูแนวนอน ปกติการใช้คำสั่ง ul li นั้นข้อมูลจะเรียงแบบแนวตั้ง กรณีถ้าต้องการให้ข้อมูลเรียงเป็นแนวนอน แนะนำให้ใช้คำสั่ง display: inline-block กับ ul li สามารถเขียนโปรแกรมได้ดังนี้

 

ตัวอย่าง CSS ul li เมนูแนวนอน ข้อมูลแนวนอน ด้วย inline-block

<style>
    ul li {
        list-style: none;
        display: inline-block;
    }
</style>
<ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
</ul>

คำอธิบาย

CSS ul li เมนูแนวนอน ข้อมูลแนวนอน ตัวอย่างแนะนำให้ใช้คำสั่ง display: inline-block กับแท็ก ul li ซึ่งจะทำให้แสดงข้อมูลจากแนวตั้งเป็นแนวนอนแทน

แก้ไข 2 ปีที่แล้ว
ชอบ
ลิ้งก์
แชร์
Devdit มีช่อง YouTube แล้ว
เราสร้างวิดีโอเกี่ยวกับเทคโนโลยี ทำตามง่ายๆ