รวมคุณสมบัติรายการทั้งหมดในนิพจน์เดียวด้วย CSS (list-style shorthand)

คุณสมบัติ list-style (Shorthand)

คุณสมบัติ list-style ให้คุณระบุคุณสมบัติรายการทั้งหมดในนิพจน์เดียว

ตัวอย่าง

ลองรันโค้ดต่อไปนี้เพื่อแสดงคุณสมบัติทั้งหมดเช่น list-style, type ฯลฯ ในบรรทัดเดียว:

<html>
  <head>
  </head>
  <body>
    <ul style="list-style: inside circle;">
      <li>Laptop</li>
      <li>Desktop System</li>
    </ul>
    <ol style="list-style: outside lower-alpha;">
      <li>Laptop</li>
      <li>Desktop System</li>
    </ol>
  </body>
</html>

รูปแบบ list-style shorthand:

list-style: <type> <position> <image>;

• type: disc, circle, square, decimal, lower-alpha, upper-roman, ฯลฯ
• position: inside, outside
• image: url(...)
• ลำดับไม่สำคัญ ค่าที่ละเว้นใช้ค่าเริ่มต้น