css boleh dibahagikan kepada tiga kategori: 1. Gaya sebaris (sebaris), menggunakan atribut gaya untuk memasukkan kod CSS dalam teg HTML, sintaks "
..< ;/nama tag>"; 2. Helaian gaya terbenam, letakkan kod CSS dalam pasangan tag gaya di bahagian kepala dokumen, sintaks ialah ""; 3. Luaran helaian gaya, letakkan Letakkan kod CSS ke dalam fail ".css" dan masukkan ke dalam dokumen html menggunakan teg pautan atau peraturan "@import".
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.
Untuk mencapai beberapa kesan dalam kod HTML, selalunya perlu menambah pengubahsuaian CSS Terdapat tiga jenis CSS dalam HTML: gaya sebaris, helaian gaya terbenam dan helaian gaya luaran.
1. Gaya Sebaris (sebaris)
Gaya sebaris ialah untuk menentukan maklumat gaya secara langsung dalam atribut gaya teg HTML Gaya sebaris ditakrifkan di dalam teg, jadi ia hanya sah untuk teg di mana ia diletakkan.
<body style="background-color:black;"> <h1 style="color:white;padding:30px;">Hostinger Tutorials</h1> <p style="color:white;">Something usefull here.</p> </body>
Anda tidak disyorkan untuk menggunakan CSS sebaris kerana setiap teg HTML perlu digayakan secara berasingan dan jika anda hanya menggunakan CSS sebaris, mengurus tapak web mungkin menjadi Sangat sukar . Walau bagaimanapun, ia boleh berguna dalam situasi tertentu. Contohnya, dalam situasi di mana anda tidak mempunyai akses kepada fail CSS atau anda hanya perlu menggunakan gaya pada satu elemen.
Kelemahan:
Mentakrifkan gaya sebaris memerlukan penentuan atribut gaya dalam setiap teg HTML, yang sangat menyusahkan
Berhati-hati terutamanya apabila menggunakan petikan berganda atau petikan tunggal dalam gaya sebaris, kerana atribut tag HTML biasanya menggunakan petikan berganda untuk membalut nilai atribut, seperti >
2. Helaian gaya terbenam
tag
Thestruktur teg boleh didapati di mana-mana dalam teg dan boleh muncul beberapa kali. Biasanya keseluruhan struktur <style>...</style> ditulis dalam bahagian
... Ciri-ciri cara memperkenalkan CSS ini ialah kod CSS setiap halaman mungkin disatukan dan dirancang Mudah digunakan semula dan diselenggara dalam halaman, tetapi penggunaan semula kod CSS antara berbilang halaman masih tidak mencukupi.<style>...</style>
<style> bdoy{font-size:14px;} </style>
<style>...</style>
<!DOCTYPE html> <html> <head> <style> body { background-color: linen; } h1 { color: maroon; margin-left: 40px; } </style> </head> <body> <h1>PHP中文网</h1> <p>https://www.php.cn/</p> </body> </html>
digunakan dalam pembangunan sebenar. Sesuai untuk situasi dengan banyak gaya. Gaya ditulis secara berasingan ke dalam fail CSS, dan kemudian fail CSS diperkenalkan ke dalam HTML untuk digunakan. 1) Menggunakan pautan
gaya pautan merujuk kepada mentakrifkan helaian gaya CSS secara luaran dan membentuk fail dengan sambungan, dan kemudian menghantarnya pada halaman melalui Teg pautan dipautkan ke halaman, dan pernyataan pautan mesti diletakkan di kawasan tag
Sintaks:.CSS
<link>
Penjelasan setiap atribut:
<link type="text/css" rel="styleSheet" href="CSS文件路径" />
另外,title 属性与 rel 属性存在联系,按 W3C 组织的计划,未来的网页文档会使用多个 <link> 元素导入不同的外部文件,如样式表文件、脚本文件、主题文件,甚至可以包括个人自定义的其他补充文件。导入这么多不同类型、名称各异的文件后,可以使用 title 属性进行选择,这时 rel 属性的作用就显现出来了,它可以指定网页文件初始显示时应用的导入文件类型,目前只能关联 CSS 样式表类型。
外部样式是 CSS 应用的最佳方案,一个样式表文件可以被多个网页文件引用,同时一个网页文件可以导入多个样式表,方法是重复使用 link 元素导入不同的样式表文件。
2)、使用@import
导入式是通过@import
在