Rumah > Artikel > hujung hadapan web > Bagaimana untuk memaut css ke html
Bagaimana untuk memaut css ke html
- 王林asal
- 2023-05-29 15:41:085759semak imbas
Dalam reka bentuk halaman web moden, CSS (Cascading Style Sheets) digunakan secara meluas untuk mencantikkan dan mereka bentuk gaya dan susun atur halaman web. Biasanya, CSS dipautkan ke dalam dokumen HTML untuk mengawal rupa dan rasa dokumen. Jadi, bagaimana anda memautkan CSS ke HTML? Artikel ini akan memperkenalkan secara ringkas kandungan berikut:
- Apakah itu CSS
CSS ialah bahasa yang digunakan untuk mentakrifkan gaya dan reka letak halaman web. Ia biasanya digunakan untuk menentukan gaya warna, saiz, kedudukan, format teks, dsb. elemen halaman web. Sama seperti HTML, CSS ialah bahasa penanda yang terdiri daripada pemilih dan blok pengisytiharan. Pemilih memilih elemen HTML untuk digayakan, dan blok pengisytiharan kemudiannya mentakrifkan gaya dan penampilan elemen tersebut.
- Kaedah untuk memautkan CSS dalam HTML
2.1 Helaian gaya luaran
Simpan kod CSS ke dalam fail helaian gaya luaran, dan kemudian gunakannya dalam dokumen HTML Pautkan fail ini ke dokumen HTML melalui tag. Pendekatan ini memastikan gaya dipisahkan sepenuhnya daripada dokumen HTML dan oleh itu lebih boleh digunakan semula. Ini juga merupakan pendekatan yang sering digunakan oleh pembangun web kerana ia menjadikan gaya mudah untuk dikekalkan dan diubah suai. Berikut ialah contoh kod:
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
Dalam contoh ini, kami menggunakan teg 2cdf5bf648cf2f33323966d7f58a7f3f untuk mentakrifkan perkaitan antara dokumen dan helaian gaya. Atribut rel digunakan untuk menentukan jenis pautan sebagai "helaian gaya", atribut type digunakan untuk menentukan jenis helaian gaya dan atribut href digunakan untuk menunjukkan laluan ke fail helaian gaya.
2.2 Helaian gaya dalaman
menyimpan kod CSS dalam teg c9ccee2e6ea535a969eb3f532ad9fe89 fail HTML. Ini memastikan bahawa dokumen HTML adalah tunggal, tetapi pengubahsuaian dan penyelenggaraan helaian gaya akan menjadi lebih sukar.
<head>
<style type="text/css">
p {
color: red;
font-size: 16px;
}
</style>
</head>Contoh ini menggunakan teg c9ccee2e6ea535a969eb3f532ad9fe89 untuk membenamkan kod CSS terus ke dalam dokumen HTML. Kod CSS boleh disertakan dalam pasangan tag c9ccee2e6ea535a969eb3f532ad9fe89 dalam bahagian 93f0f5c25f18dab9d176bd4f6de5d30e Apabila menggunakan kaedah ini, gaya akan digunakan pada semua elemen padanan di dalam dokumen HTML, bukannya hanya pada satu elemen. Kelemahan kaedah ini ialah jika anda ingin menukar tema atau menukar gaya, anda mesti mengedit setiap fail HTML.
2.3 Gaya sebaris
Tambahkan kod CSS pada atribut gaya elemen HTML tunggal. Gaya sebaris sering digunakan untuk mengubah suai gaya elemen tunggal, tetapi tidak disyorkan untuk aplikasi yang terlalu rumit dalam helaian gaya.
<p style="color: red; font-size: 16px;">This is a paragraph.</p>
Nota: Dalam gaya sebaris, nilai atribut mesti disertakan dalam petikan berganda.
- Ringkasan
Terdapat tiga cara untuk memautkan CSS ke dokumen HTML: helaian gaya luaran, helaian gaya dalaman dan gaya sebaris. Kaedah yang anda pilih bergantung pada keperluan anda. Antaranya, helaian gaya luaran ialah kaedah yang paling biasa digunakan, yang akan menjadikan pembangunan web anda berfungsi dengan lebih cekap dan lebih mudah diselenggara.
Atas ialah kandungan terperinci Bagaimana untuk memaut css ke html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!