Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Beberapa cara biasa untuk memperkenalkan css ke dalam halaman HTML

Beberapa cara biasa untuk memperkenalkan css ke dalam halaman HTML

PHPz
Lepaskan: 2023-04-06 14:14:24
asal
2708 orang telah melayarinya

CSS ialah bahasa pengaturcaraan yang digunakan untuk menggayakan halaman web, yang boleh menjadikan halaman web kelihatan lebih cantik dan profesional. Sebelum menggunakan CSS untuk menghias halaman web, ia perlu diperkenalkan ke dalam halaman web. Artikel ini akan memperkenalkan beberapa kaedah biasa untuk memperkenalkan CSS.

1. Helaian gaya sebaris

Helaian gaya sebaris merujuk kepada menulis kod CSS secara langsung dalam atribut gaya elemen HTML. Kaedah ini sesuai untuk situasi di mana elemen individu memerlukan penggayaan tersuai. Contohnya:

<p style="color: red; font-size: 18px;">这是一个段落</p>
Salin selepas log masuk

2. Helaian gaya dalaman

Helaian gaya dalaman merujuk kepada penggunaan tag <style> untuk memperkenalkan kod CSS dalam kepala dokumen untuk mengawal gaya keseluruhan dokumen HTML. Contohnya:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文档标题</title>
    <style>
        p{
            color: red;
            font-size: 18px;
        }
    </style>
</head>
<body>
    <p>这是一个段落</p>
</body>
</html>
Salin selepas log masuk

3. Helaian gaya luaran

Helaian gaya luaran merujuk kepada menyimpan kod CSS secara berasingan dalam fail CSS, dan kemudian merujuknya melalui teg <link> dalam Dokumen HTML fail. Kaedah ini sesuai untuk gaya yang perlu mengawal berbilang halaman, dan boleh menjadikan dokumen HTML lebih ringkas. Contohnya:

Tulis kod CSS dalam fail style.css:

p{
    color: red;
    font-size: 18px;
}
Salin selepas log masuk

Rujuk fail CSS dalam dokumen HTML:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文档标题</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <p>这是一个段落</p>
</body>
</html>
Salin selepas log masuk

4. Import helaian gaya

Sama seperti helaian gaya luaran, helaian gaya yang diimport juga memperkenalkan fail CSS dengan menggunakan teg <style> di kepala dokumen. Perbezaannya ialah helaian gaya yang diimport menggunakan sintaks @import untuk memperkenalkan fail CSS luaran. Contohnya:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文档标题</title>
    <style>
        @import url("style.css");
    </style>
</head>
<body>
    <p>这是一个段落</p>
</body>
</html>
Salin selepas log masuk

Di atas ialah beberapa kaedah biasa untuk memperkenalkan CSS. Di bawah senario penggunaan yang berbeza, memilih kaedah pengenalan yang berbeza boleh menjadikan pembangunan web lebih cekap dan ringkas.

Atas ialah kandungan terperinci Beberapa cara biasa untuk memperkenalkan css ke dalam halaman HTML. 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