CSS ::marker โปรไฟล์ปลอม

การระบุและการใช้งาน

CSS ::marker โปรไฟล์ปลอมนี้ใช้เพื่อตั้งค่าสไตล์ของโซนตานุชน์รายการของรายการ:

โปรไฟล์นี้มีผลสำหรับองค์ประกอบที่ตั้งค่า display: list-item ในระดับที่สูงสุด。

หมายเหตุ:คุณสมบัติต่อไปนี้สามารถใช้ร่วมกับ ::marker ใช้ร่วมกัน:

  • ทั้งหมดความเปลี่ยนแปลงของแบร์
  • ทั้งหมดความเคลื่อนไหว
  • ทั้งหมดความเปลี่ยนแปลง
  • color
  • white-space
  • content
  • text-combine-upright
  • unicode-bidi
  • direction

ตัวอย่าง

ตัวอย่าง 1

กำหนดสีและขนาดตัวอักษรของโซนตานุชน์รายการทั้งหมด:

::marker {
  font-size: 20px;
  color: red;
}

ทดลองด้วยตัวเอง

ตัวอย่าง 2

กำหนดเนื้อหา สีและขนาดตัวอักษรของโซนตานุชน์รายการของ <ul> รายการ:

ul li::marker {
  content: "@ ";
  color: pink;
  font-size: 25px;
}

ทดลองด้วยตัวเอง

ตัวอย่าง 3

ตั้งค่า <h2> โดย display: list-item และกำหนดสีและเนื้อหาของโซนตานุชน์รายการ:

h2 {
  counter-increment: h2;
  display: list-item;
}
h2::marker {
  display: list-item;
  content: "@" counter(h2) " ";
  color: lightgreen;
}
body {
  counter-reset: h2;
  font-family: verdana;
  margin: 50px;
}

ทดลองด้วยตัวเอง

CSS การใช้งาน

::marker {
  css declarations;
}

รายละเอียดเทคนิค

รุ่น: CSS3

การรองรับโปรแกรมนี้

ตัวเลขในตารางนี้ระบุสูตรรุ่นที่รองรับเสร็จสมบูรณ์ของเอลิเมนต์โปรไฟล์นี้。

Chrome Edge Firefox Safari Opera
86 86 68 18.1 72

หน้าที่เกี่ยวข้อง

คู่มือ:CSS โฉมหลอด