Bagaimana untuk membuang titik elemen li dalam css

CSS ialah salah satu kemahiran yang mesti dikuasai dalam reka bentuk web, dan mengalih keluar titik elemen li adalah petua yang agak asas tetapi praktikal. Dalam artikel ini, kami akan memperkenalkan dua kaedah biasa untuk mengalih keluar titik elemen li untuk membantu anda menguasai kemahiran CSS dengan lebih baik.

Kaedah 1: Gunakan atribut gaya senarai

Dalam CSS, anda boleh menggunakan atribut gaya senarai untuk mengawal gaya senarai. Atribut ini boleh mempunyai tiga nilai: jenis gaya senarai, imej gaya senarai dan kedudukan gaya senarai. Dan kita boleh mengalih keluar titik elemen li dengan menetapkan senarai-style-type kepada tiada.

Sebagai contoh, katakan kita mempunyai senarai HTML ringkas seperti berikut:

<ul>
  <li>苹果</li>
  <li>香蕉</li>
  <li>橘子</li>
</ul>

Untuk mengalih keluar titik daripada senarai ini, anda boleh menulis kod CSS seperti ini:

ul {
  list-style-type: none;
}

Dengan cara ini anda boleh mengalih keluar mata daripada senarai. Perlu diingatkan bahawa kaedah ini akan mengalih keluar mata keseluruhan senarai Jika anda hanya perlu mengalih keluar titik elemen li tertentu, anda boleh mencapai ini dengan menambah kelas pada elemen dan menetapkan gaya yang sepadan.

Kaedah 2: Gunakan unsur pseudo

Kaedah lain yang biasa ialah menggunakan unsur pseudo. Dalam CSS, elemen pseudo ialah elemen maya yang memudahkan untuk memasukkan kandungan ke dalam dokumen untuk menjadikannya kelihatan seperti elemen HTML sebenar. Antaranya, dua unsur pseudo yang paling biasa digunakan ialah :sebelum dan :selepas.

Dengan menetapkan atribut kandungan bagi :before pseudo-element kepada mengosongkan, dan kemudian menetapkan beberapa gaya padanya, anda boleh mengalih keluar titik elemen li. Sebagai contoh, dengan mengandaikan kod HTML kami adalah sama seperti di atas, kami boleh menulis gaya CSS seperti ini:

li:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 10px;
  vertical-align: middle;
  background-color: blue;
}

Ini akan mengalih keluar titik di hadapan setiap elemen li dan menggantikannya dengan segi empat sama biru.

Perlu diambil perhatian bahawa kaedah ini hanya menggantikan semua titik dengan segi empat sama biru Jika anda ingin menggantikannya dengan grafik lain atau mengalih keluar titik tetapi tidak menggantikannya dengan elemen lain, anda perlu menetapkan gaya lain sifatkan diri sendiri.

Ringkasnya, kita boleh menggunakan atribut gaya senarai atau elemen pseudo untuk mengalih keluar titik elemen li. Tidak kira kaedah yang digunakan, ia boleh membantu anda mencapai beberapa kesan halaman mudah dengan cepat sambil meningkatkan tahap kemahiran anda dalam CSS.

Atas ialah kandungan terperinci Bagaimana untuk membuang titik elemen li dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!