Apakah pemilih yang biasa digunakan dalam CSS3?

WBOY
Lepaskan: 2024-02-19 09:32:05
asal
457 orang telah melayarinya

Apakah pemilih yang biasa digunakan dalam CSS3?

CSS3 mempunyai banyak pemilih untuk memilih dan meletakkan elemen HTML. Berikut akan memperkenalkan beberapa pemilih CSS3 yang biasa digunakan dan memberikan contoh kod yang sepadan.

  1. Pemilih Elemen:
    Pemilih elemen ialah pemilih yang paling asas dan biasa digunakan, digunakan untuk memilih elemen dalam dokumen HTML. Berikut ialah contoh kod menggunakan pemilih elemen:

    p {
      color: red;
    }
    Salin selepas log masuk

    Kod di atas memilih semua

    dan menetapkan warna teksnya kepada merah.

  2. Pemilih Kelas:
    Pemilih kelas digunakan untuk memilih elemen dengan nama kelas yang sama. Anda perlu menambah nama kelas yang sepadan pada atribut kelas elemen HTML dan mulakan dengan noktah "." Berikut ialah contoh kod menggunakan pemilih kelas:

    .highlight {
      background-color: yellow;
    }
    Salin selepas log masuk

    Kod di atas memilih semua elemen dengan nama kelas "serlah" dan menetapkan warna latar belakangnya kepada kuning.

  3. Pemilih ID:
    Pemilih ID digunakan untuk memilih elemen dengan id yang sama. Anda perlu menambah id yang sepadan dengan atribut id elemen HTML dan mulakan dengan tanda paun "#". Berikut ialah contoh kod menggunakan pemilih ID:

    #logo {
      width: 200px;
      height: 100px;
    }
    Salin selepas log masuk

    Kod di atas memilih elemen dengan id "logo" dan menetapkan lebarnya kepada 200px dan tinggi kepada 100px.

  4. Pemilih Atribut:
    Pemilih atribut digunakan untuk memilih elemen dengan atribut tertentu. Pemilihan boleh dibuat berdasarkan kehadiran, nilai, dsb. atribut. Berikut ialah contoh kod beberapa pemilih atribut biasa:

    • Pilih elemen dengan atribut yang ditentukan:

      input[type="text"] {
      border: 1px solid black;
      }
      Salin selepas log masuk

      Kod di atas bermaksud memilih semua elemen dengan atribut jenis "teks" dan menukar sempadannya Tetapkan kepada 1px garis hitam pejal.

    • Pilih elemen yang bermula, berakhir atau mengandungi rentetan tertentu dengan nilai atribut yang ditentukan:

      a[href^="https"] {
      color: blue;
      }
      Salin selepas log masuk

      Kod di atas bermaksud memilih semua ​​elemen yang mempunyai nilai atribut href bermula dengan "https" dan tetapkan teksnya warna kepada biru.

  5. Pemilih kelas pseudo:
    Pemilih kelas pseudo digunakan untuk memilih keadaan atau kedudukan tertentu elemen. Berikut ialah contoh kod beberapa pemilih kelas pseudo yang biasa digunakan:

Di atas ialah beberapa pemilih dan contoh kod yang biasa digunakan dalam CSS3. Memilih pemilih yang sesuai boleh memilih dan mengubah suai gaya elemen HTML dengan mudah, meningkatkan kesan dan fleksibiliti reka bentuk web.

Atas ialah kandungan terperinci Apakah pemilih yang biasa digunakan dalam CSS3?. 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