Untuk memaparkan kesan helaian gaya CSS yang dijangka dalam penyemak imbas, penyemak imbas mesti mengenali dan memanggil CSS dengan betul. Apabila penyemak imbas membaca helaian gaya, ia mesti membacanya dalam format teks Berikut ialah empat kaedah memasukkan helaian gaya CSS ke dalam halaman: memaut ke helaian gaya luaran, helaian gaya dalaman, mengimport helaian gaya penampilan dan gaya terbenam.
1. Pautan ke helaian gaya luaran
Untuk memaut ke helaian gaya luaran ialah menyimpan helaian gaya sebagai fail helaian gaya dan kemudian tambahkannya ke halaman Gunakan teg <pautan> untuk memaut ke fail helaian gaya ini> ini mesti diletakkan di bahagian <head>
<head>
…… <link href="mystyle.css" rel="stylesheet " type="text/css" media="all" >
......
</head>
Contoh di atas menunjukkan bahawa penyemak imbas membaca helaian gaya yang ditentukan dalam format dokumen daripada fail mystyle.css. rel="stylesheet" merujuk kepada penggunaan helaian gaya luaran ini dalam halaman. type="text/css" bermaksud jenis fail ialah teks helaian gaya. href="mystyle.css" ialah tempat letak fail. media adalah untuk memilih jenis media ini termasuk: skrin, kertas, peranti sintesis pertuturan, peranti membaca Braille, dsb.
Fail helaian gaya luaran boleh digunakan pada berbilang halaman. Apabila anda menukar fail helaian gaya ini, gaya semua halaman diubah sewajarnya. Ia amat berguna apabila membuat sejumlah besar laman web dengan halaman gaya yang sama Ia bukan sahaja mengurangkan beban kerja pendua, tetapi juga memudahkan pengubahsuaian dan penyuntingan masa hadapan, dan juga mengurangkan muat turun berulang kod semasa menyemak imbas.
Nota
Fail helaian gaya boleh dibuka dan diedit dengan mana-mana editor teks (contohnya: Notepad Umumnya, sambungan fail helaian gaya ialah .css. Kandungan adalah helaian gaya yang ditentukan dan tidak mengandungi teg HTML Kandungan fail mystyle.css adalah seperti berikut:
hr {color: sienna}
p {margin-kiri: 20px}
body {background-image: url("images/back40.gif")} /*Definisi Warna garisan mendatar adalah kuning bumi; jidar di sebelah kiri perenggan ialah 20 piksel; 🎜>
2. Helaian gaya dalaman
Helaian gaya dalaman meletakkan helaian gaya di bahagian <kepala> Halaman. gaya yang ditakrifkan ini digunakan pada halaman Gaya Jadual dimasukkan menggunakan teg <gaya>
<kepala>
…… imej: url("images/back40.gif")}
</style>
……
</head>
3. Mengimport helaian gaya luaran Mengimport helaian gaya luaran merujuk kepada < ;style> untuk mengimport helaian gaya luaran, gunakan @import semasa mengimport, lihat contoh berikut:
<head> 🎜>
…… <style type=”text/css”> <!-- @import “mystyle.css”
Perisytiharan helaian gaya lain -->
</style> ...... .css helaian gaya, perhatikan laluan helaian gaya luaran apabila menggunakannya. Kaedah ini hampir sama dengan kaedah memaut ke helaian gaya, tetapi kaedah input helaian gaya luaran mengimport mempunyai lebih banyak kelebihan. Pada asasnya ia adalah bersamaan dengan disimpan dalam helaian gaya dalaman.
Nota: Mengimport helaian gaya luaran mestilah pada permulaan helaian gaya, di atas helaian gaya dalaman yang lain.
4 Gaya sebaris
Gaya sebaris Ia adalah. digunakan bercampur dalam tag HTML Dengan cara ini, anda boleh dengan mudah menentukan gaya elemen tertentu secara berasingan. Penggunaan gaya sebaris adalah untuk menambah terus parameter gaya pada teg HTML. Kandungan parameter gaya ialah atribut dan nilai CSS, seperti dalam contoh berikut:
<p style="color: sienna;margin-left: 20px;">
Ini ialah perenggan </p>
<!--Warna perenggan ini ialah khaki, dan jidar kiri ialah 20 piksel- ->
Kandungan dalam tanda petikan selepas parameter gaya adalah bersamaan dengan kandungan dalam kurungan kerinting helaian gaya.
Nota: Parameter gaya boleh digunakan pada mana-mana elemen dalam BODY (termasuk BODY itu sendiri), kecuali BASEFONT, PARAM dan SCRIPT.
Tindanan berbilang helaian gaya
Helaian gaya CSS mempunyai susunan bertingkat Di sini kita membincangkan superposisi kaedah memasukkan helaian gaya ini Jika beberapa helaian gaya berbeza digunakan pada pemilih yang sama, nilai atribut ini akan bertindih beberapa kali konflik antara helaian gaya, helaian yang terakhir ditakrifkan akan diguna pakai. Sebagai contoh, kami mula-mula memaut dalam helaian gaya luaran, yang mentakrifkan atribut warna, jajaran teks dan saiz fon bagi pemilih h3:
h3
{
warna: merah;
sejajarkan teks:
saiz fon: 8pt; Dijajar ke kiri; saiz teks ialah saiz 8*/
Kemudian atribut penjajaran teks dan saiz fon bagi pemilih h3 juga ditakrifkan dalam helaian gaya dalaman:
h3
{ selaras teks: kanan; saiz fon: 20pt; >}
/*Teks tajuk 3 dijajarkan ke kanan; saiznya ialah 20 mata*/
Kemudian gaya bertindih halaman ini ialah:
warna: merah;
selaraskan teks: kanan; > saiz fon: 20pt; /*Warna teks dijajarkan ke kanan; helaian gaya luaran, dan Apabila kedua-dua penjajaran dan saiz fon ditakrifkan, takrifan kemudian akan diutamakan daripada helaian gaya dalaman.
Tempahan bertingkat
Apabila elemen HTML yang sama digayakan oleh lebih banyak daripada satu Apabila menentukan, gaya yang manakah akan digunakan? Secara umumnya, semua gaya akan dilantunkan dalam helaian gaya maya baharu mengikut peraturan berikut, dengan nombor 4 mempunyai keutamaan tertinggi.
1. Tetapan lalai penyemak imbas
2. Helaian gaya luaran3. . Gaya sebaris (dalam elemen HTML)
Oleh itu, gaya sebaris (dalam elemen HTML) mempunyai keutamaan tertinggi, yang bermaksud ia akan diutamakan daripada pengisytiharan gaya berikut: Gaya dalam pengisytiharan teg, pengisytiharan gaya dalam helaian gaya luaran, atau pengisytiharan gaya dalam penyemak imbas (lalai). bahagian seterusnya
