Bermula dengan CSS: Menggayakan Halaman Web Anda

CSS (Cascading Style Sheets) ialah asas reka bentuk web. Ia membolehkan anda mengawal rupa dan rasa tapak web anda daripada fon warna kepada reka letak dan animasi.

1. Apakah itu CSS?

CSS ialah bahasa yang digunakan untuk menerangkan pembentangan dokumen yang ditulis dalam HTML. Ia mentakrifkan cara elemen HTML harus dipaparkan pada skrin, kertas atau dalam media lain.

2. Sintaks Asas

Peraturan CSS terdiri daripada pemilih dan blok pengisytiharan:

selector {
  property: value;
}

contohnya:

body {
  background-color: lightblue;
}

Ini menukar warna latar belakang halaman kepada biru muda.

3. Pemilih

Pemilih membolehkan anda menyasarkan elemen HTML tertentu untuk menggunakan gaya. Anda boleh memilih elemen dengan:

• Jenis: p {} menyasarkan semua perenggan.
• Kelas: .my-class {} menyasarkan elemen dengan kelas "my-class".
• ID: #my-id {} menyasarkan elemen dengan ID "my-id".

4. Model Kotak

Setiap elemen HTML boleh dianggap sebagai kotak, yang terdiri daripada:

• Kandungan: Teks atau media sebenar di dalamnya.
• Pelapik: Ruang antara kandungan dan sempadan.
• Sempadan: Garis luar di sekeliling elemen.
• Margin: Ruang di luar sempadan, memisahkan elemen.

5. Harta Bersama

Warna: warna: merah; menukar warna teks.

• Fon: saiz fon: 16px; menetapkan saiz teks.
• Latar belakang: latar belakang-warna: kelabu muda; menukar warna latar belakang.
• Lebar/Tinggi: lebar: 100%; dan ketinggian: 200px; tentukan dimensi unsur.

6. Reka Bentuk Responsif

Gunakan pertanyaan media untuk menjadikan halaman web anda kelihatan baik pada semua peranti. Contohnya:

@media screen and (max-width: 600px) {
  body {
    background-color: lightyellow;
  }
}

Ini menukar warna latar belakang kepada kuning muda apabila lebar skrin ialah 600px atau kurang.

Atas ialah kandungan terperinci Bermula dengan CSS: Menggayakan Halaman Web Anda. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!