CSS語法包括下列幾種：
- 背景控制
- 邊框控制
- 文字控制
- 文字連結控制
- 滑鼠樣式控制
- 方框控制（邊界、欄位間距）
￭語法說明
-- 背景控制：
body{ /* body 是可以依照需要作改變的，下面的內容才是重要的！ */
background-image:url(圖片位址); /*
圖片連結位置 */
background-attachment:fixed; /*
圖片位置是否要固定 */
background-repeat:no-repeat;
/* 圖片是否要重複顯示 */
background-position:right;
/* 圖片對齊格式 */
width:400px; /*
文字區塊的寬度 */
}
1.
/*
XXX */(註解)：註解幫助自己看懂，這部分程式不會執行！XXX可以自行填寫！
2.
textarea(文字區塊)：這個部分稱作CSS樣式定義類別，一般來說可以自己定義名稱，但是由於這裡我們是要定義HTML語法的標籤，所以是不能更改的！必須使用textarea。當然如果要定義<h1>，就改為h1！(★注意： 不用"<>")
3.
background-image(背景影像)：看你的圖片位址在何處就怎麼寫！只要填在url()的()裡面即可！
4.
background-attachment（背景附著）：在這裡你可以決定背景圖片的位置。
屬性有：scroll：隨著捲軸捲動
inherit：繼承之前的設定 fixed：固定不動
5.
background-repeat(背景重複)：看看背景圖片是不是要重複顯示。
屬性有：repeat：重複顯示
no-repeat：不重複顯示 repeat-x：只在X軸重複顯示
repeat-y：只在Y軸重複顯示
6.
background-position(背景位置)：決定背景要置中、靠左、靠右的設定。
屬性有：left：靠左對齊
center：置中對齊 right：靠右對齊
top：向上對齊 bottom：向下對齊
inherit：傳統繼承(預設)
7.
width(寬)：文字區塊的寬度
(可以不設定，系統會自動設定大小)
8.
height(高)：文字區塊的高度
(可以不設定，系統會自動設定大小)
PS1
其餘在「textarea」裡面還能夠加上許多設定。例如邊線、文字顏色等等！因為部屬於這部分的討論範圍！暫時就不列出來！
PS2 如果你不使用背景影像的話，只想用純顏色當背景時，可以將background-image(背景影像)用background-color(背景顏色)取代！但是盡量避免兩個語法同時使用！
範例：background-color:#FF6600;
綠色的部分就是填上自己喜歡的顏色！
￭ 語法說明
-- 邊框控制：
/* 語法開始：寫法一
-- 分門別類，無微不至 */
/* 分成上下左右(4部分)
寬度樣式顏色(3部分)
總計12(4x3)行 */
body { /* body 是可以依照需要作改變的，下面的內容才是重要的！ */
border-XXX-width: 1px;
/* 邊框寬度 */
border-XXX-style: dotted;
/* 邊框樣式 */
border-XXX-color: #0066FF;
/* 邊框顏色 */
}
- XXX：請各位先注意XXX的部分，這裡XXX代表著是邊框的上下左右。
屬性有：top：上方 bottom：下方 left：左邊 right：右邊
- Width(寬)：邊框寬度。屬性有：N px：像素 N pt：點 N in：英吋 N %：百分比 (N為大小，必須為正整數)
- Style（樣式）：邊框樣式。屬性有：dotted：點狀線 dashed：虛線 solid：實線 double：雙實線 groove：溝道狀 ridge：山脊狀inset：凹陷狀 outset凸起狀
- Color(顏色)：邊框顏色。屬性為：#XXXXXX
(XXXXXX為顏色代碼)
/* 語法開始：寫法二
-- 精簡寫法，功用一樣 */
/* 只分成上下左右(4部分)
寬度樣式顏色並列在同一行程式 */
body {
border-XXX: width style color;
/* 邊框 寬度 樣式 顏色
*/
}
★注意：相關的語法大致和第一種都像同，只是寫法不一樣！假設我要設定上方邊框為寬度一像素、虛線、紅色，就可以寫成：
border-top:
1px
dashed #FF0000; /* 邊框 寬度 樣式 顏色
*/
/* 語法開始：寫法三
-- 最為精簡、但有限制 */
/* 使用時機：當上下左右、寬度、樣式、顏色都要設定一樣的時候 */
body {
border: width style color; /*
邊框 寬度 樣式 顏色
*/
}
|
