Rumah > hujung hadapan web > tutorial css > Bagaimana Menukar Warna Peluru dalam Senarai HTML Tanpa Menggunakan Elemen Span?

Bagaimana Menukar Warna Peluru dalam Senarai HTML Tanpa Menggunakan Elemen Span?

DDD
Lepaskan: 2024-12-20 12:38:21
asal
972 orang telah melayarinya

How to Change Bullet Colors in HTML Lists Without Using Span Elements?

Cara Mengubah Suai Warna Bullet dalam Senarai HTML Tanpa Elemen Span

Dalam senario tertentu, anda mungkin mahu menukar warna peluru dalam Senarai HTML tanpa menambah elemen dalam

  • tag. Berikut ialah penyelesaian bijak yang mengelakkan penggunaan rentang.

    Untuk mencapai matlamat ini, gunakan elemen pseudo :sebelum:

    li {
      list-style: none;
    }
    
    li:before {
      /* For a round bullet */
      content: '22';
      /* For a square bullet */
      /* content: 'A0'; */
      display: block;
      position: relative;
      max-width: 0;
      max-height: 0;
      left: -10px;
      top: 0;
      color: green;
      font-size: 20px;
    }
    Salin selepas log masuk

    Kaedah ini mengalih keluar gaya peluru lalai dan mencipta peluru baharu melalui: sebelum. Ia memberikan fleksibiliti dari segi bentuk dan warna, dengan sokongan dalam penyemak imbas utama termasuk IE8, Firefox dan Chrome.

    Atas ialah kandungan terperinci Bagaimana Menukar Warna Peluru dalam Senarai HTML Tanpa Menggunakan Elemen Span?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

  • sumber:php.cn
    Kenyataan Laman Web ini
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Tutorial Popular
    Lagi>
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan