Cara menulis dan menggunakan kod CSS-Soal Jawab bahagian hadapan-php.cn

Cara menulis dan menggunakan kod CSS

PHPz

Lepaskan： 2023-04-21 14:11:40

asal

635 orang telah melayarinya

CSS, nama penuh Cascading Style Sheets, ialah bahasa helaian gaya yang digunakan untuk reka bentuk web Ia digunakan untuk menerangkan rupa HTML atau XML (digunakan pada mana-mana dokumen XML, termasuk SVG atau XHTML) dokumen dan reka letak . CSS berfungsi dengan mentakrifkan sifat yang berkaitan dengan teg tertentu untuk menentukan cara teg ini dipaparkan pada penyemak imbas, dengan itu mencapai gaya, tipografi dan reka letak halaman web.

Dalam reka bentuk web, CSS memainkan peranan yang sangat penting kerana ia boleh menjadikan rupa dan reka letak halaman web lebih cantik dan mudah dikendalikan. Untuk menggunakan CSS, kita perlu tahu cara menulis dan menggunakan kod CSS.

Menulis kod CSS

Kod CSS terdiri daripada pemilih dan pengisytiharan. Pemilih digunakan untuk menentukan elemen tag HTML dalam halaman web, manakala pengisytiharan digunakan untuk menentukan gaya elemen ini. Berikut ialah contoh kod CSS:

p {
    color: red;
    font-size: 18px;
}

Salin selepas log masuk

Dalam contoh di atas, p ialah pemilih yang sepadan dengan semua teg  dan mentafsir gayanya sebagai blok pengisytiharan CSS. color dan font-size ialah sifat CSS khusus dan nilainya masing-masing adalah red dan 18px.

Benamkan kod CSS

Benamkan kod CSS bermaksud meletakkan kod CSS di dalam teg <head> antara teg <style> dokumen HTML. Gaya CSS yang ditakrifkan dalam kaedah ini hanya digunakan pada halaman semasa. Contohnya adalah seperti berikut:

<!DOCTYPE html>
<html>
<head>
    <title>嵌入CSS代码示例</title>
    <style>
        p {
            color: red;
            font-size: 18px;
        }
    </style>
</head>
<body>
    <p>这是一段红色的文本，字号为18像素。</p>
</body>
</html>

Salin selepas log masuk

Dalam contoh ini, kami mentakrifkan pemilih p yang menetapkan warna teks kepada merah dan saiz fon kepada 18 piksel. Gaya CSS ini hanya digunakan pada elemen  halaman semasa.

Pautan fail CSS luaran

Kami juga boleh menyimpan kod CSS dalam fail CSS yang berasingan dan memautkannya menggunakan teg <link> dalam dokumen HTML ke halaman . Gaya CSS yang ditakrifkan dengan cara ini boleh digunakan oleh berbilang halaman. Contohnya adalah seperti berikut:

Andaikan kita menyimpan kod CSS berikut dalam fail yang dipanggil "style.css":

p {
    color: red;
    font-size: 18px;
}

Salin selepas log masuk

Berikut ialah pautan HTML ke Dokumen "style.css" contoh:

<!DOCTYPE html>
<html>
<head>
    <title>外部CSS文件链接示例</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <p>这是一段红色的文本，字号为18像素。</p>
</body>
</html>

Salin selepas log masuk

Dalam contoh ini, kami menggunakan teg <link> untuk memautkan fail style.css ke halaman semasa supaya gaya CSSnya boleh digunakan.

Ringkasan

CSS ialah bahasa helaian gaya yang digunakan untuk reka bentuk web, yang boleh menjadikan penampilan dan reka letak halaman web lebih cantik dan lebih mudah untuk dikendalikan. Untuk menggunakan CSS, kita perlu menulis kod CSS dan membenamkannya ke dalam dokumen HTML atau menggunakannya dengan memaut ke fail CSS luaran. Dengan menguasai kaedah ini, kami boleh menggunakan CSS dengan mudah untuk mereka bentuk halaman web yang lebih cemerlang dan diperibadikan.

Atas ialah kandungan terperinci Cara menulis dan menggunakan kod CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!