Sintaks CSS


Peraturan sintaks CSS terdiri daripada dua bahagian utama: pemilih dan satu atau lebih pengisytiharan (kumpulan pengisytiharan). Pemilih biasanya elemen HTML yang anda perlukan untuk menukar gaya. Setiap pengisytiharan terdiri daripada harta dan nilai, di mana harta ialah atribut gaya yang anda ingin tetapkan, ada satu untuk setiap harta, dan harta dan nilai dipisahkan dengan titik bertindih. Pengisytiharan CSS sentiasa berakhir dengan koma bertitik (;), dan kumpulan pengisytiharan disertakan dalam pendakap ({}).

Demonstrasi Instance

Instance

<html>
<head>
<style>
body {background-color:yellow;}
h1   {font-size:36pt;}
h2   {color:blue;}
p    {margin-left:50px;}
</style>
</head>

<body>

<h1>This header is 36 pt</h1>
<h2>This header is blue</h2>

<p>This paragraph has a left margin of 50 pixels</p> 

</body>
</html>

Jalankan Instance»

Klik Butang "Jalankan Instance" untuk melihat contoh dalam talian

Instance

<html>
<head>
<style>
body {background-color:tan;}
h1   {color:maroon;font-size:20pt;}
hr   {color:navy;}
p    {font-size:11pt;margin-left:15px;}
a:link    {color:green;}
a:visited {color:yellow;}
a:hover   {color:black;}
a:active  {color:blue;}
</style>
</head>

<body>

<h1>This is a header 1</h1>
<hr>

<p>You can see that the style 
sheet formats the text</p>

<p><a href="http://www.w3cschool.cc" 
target="_blank">This is a link</a></p>

</body>
</html>

Run Instance»

Klik " Butang Run Instance" " untuk melihat contoh dalam talian

Contoh CSS

Peraturan CSS terdiri daripada dua bahagian utama: pemilih dan satu atau lebih pengisytiharan:

1.jpg

Pemilih biasanya merupakan elemen HTML yang anda perlukan untuk menukar gaya.

Setiap pengisytiharan terdiri daripada atribut dan nilai. Sifat

ialah atribut gaya yang ingin anda tetapkan. Setiap atribut mempunyai nilai. Sifat dan nilai dipisahkan oleh titik bertindih.

Contoh CSS

Pengisytiharan CSS sentiasa berakhir dengan koma bernoktah (;) dan kumpulan pengisytiharan disertakan dalam pendakap ({}): 

p {color:red;text-align:center;

Untuk menjadikan CSS lebih mudah dibaca, anda boleh menerangkan hanya satu atribut bagi setiap baris:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
p
{
	color:red;
	text-align:center;
} 
</style>
</head>

<body>
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
</body>
</html>

Jalankan Contoh»

Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian

Komen CSS

Ulasan digunakan untuk menerangkan kod anda, dan jangan ragu untuk mengeditnya, pelayar akan mengabaikannya.

Komen CSS bermula dengan "/*" dan diakhiri dengan "*/". 🎜>