Bagaimanakah Saya Boleh Menukar Warna Peluru dalam Senarai HTML Menggunakan CSS Sahaja?

Menetapkan Warna Bullet dalam Senarai HTML tanpa Imej atau Elemen Sebaris

Apabila menggayakan senarai tidak tersusun, seseorang mungkin mahu menukar warna peluru tanpa menjejaskan teks item senarai. Semasa hanya menetapkan warna

elemen berfungsi, ia juga menukar warna teks.

Penyelesaian CSS-Sahaja yang Elegan

Jawapannya terletak pada ::sebelum unsur pseudo:

ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

li {
  padding-left: 1em;
  text-indent: -0.7em;
}

li::before {
  content: "•";
  color: #F00;
}

Kod ini mencapai kesan yang diingini tanpa menggunakan imej atau elemen sebaris. Begini cara ia berfungsi:

• gaya senarai: tiada; mengalih keluar peluru lalai.
• ::sebelum mencipta elemen pseudo yang diletakkan sebelum setiap
• item.
• kandungan: "•" menentukan peluru yang diingini sebagai cakera atau segi empat sama.
• warna: #F00; menetapkan warna peluru.
• Mengenden teks item senarai dengan padding-left dan text-indent memastikan penjajaran dengan peluru.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menukar Warna Peluru dalam Senarai HTML Menggunakan CSS Sahaja?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!