Jenis gaya CSS termasuk: gaya asas (fon, warna, sempadan, padding/margin), gaya susun atur (terapung, kedudukan, paparan, susun atur grid, susun atur anjal), kesan khas (peralihan, animasi, transformasi, penapis, mod campuran ), gaya jadual (paparan jadual, data jadual) dan gaya lain (pertanyaan media, sifat tersuai, garis masa animasi).
Pelbagai Gaya CSS
Cascading Style Sheets (CSS) menyediakan pelbagai pilihan penggayaan yang boleh digunakan untuk meningkatkan penampilan dan reka letak halaman web. Gaya ini boleh dibahagikan kepada kategori utama berikut:
1. Gaya asas:
-
Fon: Kawal keluarga, saiz dan gaya fon.
-
Warna: Tetapkan warna teks, latar belakang dan jidar.
-
Sempadan: Tambahkan jidar pada elemen dan kawal lebar, gaya dan warnanya.
-
Padding dan Margin: Tambah ruang di dalam atau di luar elemen.
2. Gaya reka letak:
-
Apung: Membenarkan elemen dijajarkan secara mendatar di sepanjang halaman.
-
Kedudukan: Betulkan elemen pada lokasi tertentu atau letakkannya berbanding elemen lain.
-
Paparan: Kawal keterlihatan unsur dan tentukan cara ia berinteraksi dengan unsur lain.
-
Reka Letak Grid: Buat reka letak halaman berasaskan grid untuk paparan mudah merentas peranti.
-
Reka Letak Fleksibel: Membenarkan elemen melaraskan secara dinamik apabila saiz tetingkap berubah.
3. Kesan Khas:
-
Peralihan: Peralihan dengan lancar antara atribut.
-
Animasi: Buat urutan animasi untuk meningkatkan interaktiviti halaman web.
-
Ubah: Pusing, skala atau elemen condong.
-
Penapis: Gunakan kesan imej seperti kabur, pelarasan rona atau ketepuan.
-
Mod Campuran: Campurkan gaya berbilang elemen untuk mencipta kesan unik.
4. Gaya jadual:
-
Paparan jadual: Kawal penampilan jadual, termasuk sempadan, jarak sel dan penjajaran.
-
Data jadual: Data jadual gaya, termasuk teks, nilai dan pautan.
5. Gaya lain:
-
Pertanyaan media: Tukar gaya berdasarkan saiz skrin, jenis peranti atau syarat lain.
-
Sifat Tersuai: Buat pembolehubah boleh guna semula yang boleh digunakan dengan mudah merentas gaya.
-
Garis Masa Animasi: Selaraskan main balik jujukan animasi.
Atas ialah kandungan terperinci Apakah jenis gaya css?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!