Bagaimana untuk merujuk fail css

PHPz
Lepaskan: 2023-04-25 15:13:51
asal
2117 orang telah melayarinya

Dengan pembangunan berterusan teknologi pembangunan web, keperluan reka bentuk web semakin tinggi dan lebih tinggi. Memandangkan fail CSS adalah asas penting untuk reka bentuk web, cara merujuk fail CSS dengan betul telah menjadi kemahiran yang mesti dipelajari dalam pembangunan web. Artikel ini akan memperkenalkan cara merujuk fail CSS untuk membantu pemula menguasai kemahiran ini dengan lebih baik.

1. Apakah itu fail CSS?

CSS, nama penuh Cascading Style Sheets, ialah bahasa helaian gaya yang digunakan untuk menentukan cara dokumen seperti HTML, XHTML dan XML dipersembahkan. Dengan menggunakan CSS, struktur dan kandungan halaman web boleh diasingkan, yang memisahkan kandungan dan gaya halaman web dan meningkatkan kebolehbacaan dan kebolehselenggaraan halaman web.

2. Bagaimana untuk mencipta fail CSS?

Fail CSS boleh dibuat dalam dua cara: tulisan tangan atau menggunakan alat penyuntingan CSS.

1. Fail CSS tulisan tangan

Fail CSS tulisan tangan perlu ditulis dalam editor teks atau alat pembangunan dan format fail ialah ".css". Langkah khusus adalah seperti berikut:

(1) Cipta fail teks baharu dalam format "*.css" dalam mana-mana penyunting teks, seperti "style.css".

(2) Tulis kod gaya CSS dalam fail teks. Kod gaya CSS termasuk peraturan gaya, atribut dan nilai atribut. Contohnya:

p {
   color: red;
   text-align: center;
}
Salin selepas log masuk

(3) Pautkan fail CSS dalam dokumen HTML. Berikut ialah cara untuk memautkan fail CSS.

2. Gunakan alat penyuntingan CSS

Berbanding dengan fail CSS tulisan tangan, menggunakan alat penyuntingan CSS profesional boleh meningkatkan kecekapan pembangunan dan kualiti kod. Alat pengeditan CSS biasa termasuk Dreamweaver, Teks Sublime, Kod Visual Studio, dsb.

3. Bagaimana hendak memetik fail CSS?

Terdapat dua cara utama untuk merujuk fail CSS: helaian gaya dalaman dan helaian gaya luaran.

1. Helaian gaya dalaman

Helaian gaya dalaman membenamkan kod gaya CSS terus ke dalam dokumen HTML. Langkah-langkah khusus adalah seperti berikut:

(1) Masukkan teg gaya <style> dalam teg kepala.

<head>
   <style>
      p {
         color: red;
         text-align: center;
      }
   </style>
</head>
Salin selepas log masuk

(2) Tulis kod gaya CSS dalam tag gaya. Contohnya:

<style>
   p {
      color: red;
      text-align: center;
   }
</style>
Salin selepas log masuk

Kelebihan: Ia sesuai untuk mengubah suai gaya sebilangan kecil halaman dan mudah digunakan.

Kelemahan: sukar diselenggara, meningkatkan kerumitan kod, dan juga mengurangkan kesan caching penyemak imbas.

2. Helaian gaya luaran

Helaian gaya luaran menulis kod CSS dalam fail berasingan dan kemudian merujuknya melalui pautan dalam dokumen HTML. Langkah-langkah khusus adalah seperti berikut:

(1) Buat fail CSS dan tulis kod gaya CSS.

(2) Masukkan teg pautan <link> dalam teg kepala untuk menunjuk ke fail CSS.

<head>
   <link rel="stylesheet" type="text/css" href="style.css">
</head>
Salin selepas log masuk

Kelebihan: Gaya diasingkan daripada kandungan halaman, menjadikan penyelenggaraan fail mudah.

Kelemahan: Fail CSS tambahan perlu dimuatkan, yang meningkatkan permintaan HTTP berbanding helaian gaya dalaman.

4. Ringkasan

Melalui pengenalan artikel ini, kami telah mempelajari penciptaan dan rujukan fail CSS, dan memahami ciri helaian gaya dalaman dan helaian gaya luaran. Dalam pembangunan web, merujuk fail CSS dengan betul adalah kemahiran yang sangat asas. Saya harap artikel ini dapat membantu pemula menguasai kemahiran ini dengan lebih baik dan meningkatkan lagi tahap reka bentuk dan pembangunan web.

Atas ialah kandungan terperinci Bagaimana untuk merujuk fail css. 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
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!