วิธีการสร้าง: กลุ่มรายการ
เรียนรู้วิธีการใช้ CSS ในการแปลงรายการเบื้องต้นเป็น 'กลุ่มรายการ'。
- Adele
- Agnes
- Billy
- Bob
- Calvin
- Christina
- Cindy
วิธีการสร้างกลุ่มรายการ
ขั้นที่ 1 - กำหนด HTML:
<ul> <li>Adele</li> <li>Agnes</li> <li>Billy</li> <li>Bob</li> <li>Calvin</li> <li>Christina</li> <li>Cindy</li> </ul>
ขั้นที่ 2 - กำหนด CSS:
ul { list-style-type: none; /* ลบลำดับรายการ */ padding: 0; /* ลบระยะห่างด้านใน */ margin: 0; /* ลบระยะห่างด้านนอก */ } ul li { border: 1px solid #ddd; /* กำหนดเส้นขอบเล็กแบบแข็งต่อแต่ละรายการในรายการ */ margin-top: -1px; /* ป้องกันการเรียงของกรอบทั้งสองด้าน */ background-color: #f6f6f6; /* กำหนดสีพื้นหลังที่เป็นสีเงา */ padding: 12px; /* กำหนดระยะห่างด้านใน */ }
相关页面
教程:CSS 列表