cara menggunakan css

CSS ialah bahasa helaian gaya yang digunakan untuk reka bentuk web yang mengawal cara HTML atau XHTML muncul dan diformatkan. CSS ialah bahagian penting dalam pembangunan bahagian hadapan WEB, dan menguasai CSS ialah kemahiran penting untuk pembangunan bahagian hadapan hari ini.

Jadi, bagaimana hendak menggunakan CSS? Artikel ini akan memperkenalkan penggunaan asas dan peraturan biasa CSS untuk membantu pemula menguasai CSS dengan cepat.

1. Buat fail CSS
   Mula-mula, anda perlu mencipta fail CSS. Ia boleh dibuat menggunakan editor teks (seperti Notepad, Teks Sublime, dsb.) dan disimpan sebagai fail .css. Biasanya, anda menyimpan fail CSS dalam fail berasingan dan kemudian menggunakan elemen dalam HTML untuk menyambungkan fail CSS ke halaman HTML.
2. Pemilih CSS
   Pemilih yang paling biasa dalam CSS ialah pemilih elemen, yang mewakili jenis penanda yang anda mahu gunakan gaya (seperti h1, p, dsb.). Menandakan nama pemilih dengan "#" menunjukkan pemilih ID, manakala awalan nama dengan "."

Sebagai contoh, untuk menambah gaya pada elemen dengan id "header", kod CSS adalah seperti berikut:

#header{
  background-color: #ccc;
  width: 100%;
}

3. Sifat CSS
   dalam CSS , atribut digunakan untuk menentukan gaya yang akan digunakan pada elemen. Sebagai contoh, gaya CSS berikut akan menetapkan saiz fon kepada 16 piksel untuk semua teg p: Atribut

   p{
     font-size: 16px;
   }

   juga boleh menerima berbilang nilai. Sebagai contoh, peraturan CSS berikut akan menetapkan 4 nilai untuk sifat jidar elemen:

   margin: 10px 5px 15px 20px;

   Nilai pertama ialah padding atas, yang kedua ialah padding kanan, yang ketiga ialah padding bawah dan yang keempat adalah padding bawah. Jika padding kiri tidak disediakan, ia lalai sama dengan padding kanan; jika padding bawah tidak disediakan, ia lalai dengan padding atas.

4. Lembaran Gaya CSS
   Untuk tapak web yang besar, disyorkan untuk membahagikan helaian gaya kepada beberapa bahagian untuk pengurusan yang lebih baik. Pendekatan yang paling biasa ialah membahagikan gaya tapak web kepada pelbagai helaian gaya, masing-masing mengawal bahagian tapak web yang berbeza.

Sebagai contoh, tapak web biasa mungkin mempunyai beberapa helaian gaya: helaian gaya global tapak web bertanggungjawab untuk gaya keseluruhan tapak web, bar navigasi, pengepala, pengaki, dsb.; bertanggungjawab untuk halaman dalaman Styles; terdapat juga lembaran gaya biasa yang bertanggungjawab untuk reka bentuk responsif, membolehkan tapak web menyesuaikan dengan saiz skrin yang berbeza bagi pelbagai peranti.

5. Gunakan rangka kerja dan prapemproses CSS
   Rangka kerja CSS ialah satu set helaian gaya biasa dan peraturan yang boleh mempercepatkan penggayaan tapak web. Prapemproses ialah alatan yang meningkatkan kefungsian CSS, seperti LESS, SASS dan Stylus. Mereka membenarkan pembangun mengawal gaya tapak web menggunakan pembolehubah, fungsi dan peraturan bersarang.

Sebagai contoh, berikut ialah beberapa rangka kerja CSS yang popular:

-Bootstrap: Salah satu rangka kerja CSS yang paling popular dan digunakan secara meluas, ia mengandungi pelbagai komponen termasuk borang, navigasi, Butang, grid dan susun atur.

-Asasi: Satu lagi rangka kerja CSS yang sangat popular yang menyepadukan banyak reka letak dan komponen UI serta menyediakan pilihan penyesuaian. Menyediakan lebih banyak penyesuaian susun atur daripada Bootstrap.

-Materialize CSS: Rangka kerja CSS berdasarkan Reka Bentuk Bahan, dengan banyak kawalan asli, ia merupakan rangka kerja yang sangat tampan.

Ringkasan
Artikel ini memperkenalkan penggunaan asas dan peraturan biasa CSS. Selain itu, terdapat banyak sifat dan pertimbangan CSS lain yang perlu dikuasai dalam kerja amali. Amalan ialah cara terbaik untuk belajar, dengan melaksanakan projek dan mencuba kaedah yang berbeza untuk meningkatkan pemahaman dan aplikasi CSS anda.

Atas ialah kandungan terperinci cara menggunakan css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!