教你認識常用CSS語法 - 網頁設計

... text-align: center; (文字置中對齊); text-align: justify; (文字分散對齊) ... vertical-align: middle; (垂直置中對齊); vertical-align: text-top; (文字垂直 ... 網站設計百科大全 網頁設計 基本網頁設計認識CSS常用語法 import_contacts  常用語法 8677 適用範圍 使用css等語法來建立一個網站吧! 實用性： 重要性： 教你認識常用CSS語法 列出所有CSS屬性。

在您看完這篇內容後，您將會了解CSS的基本概念，同時可以利用常見的CSS屬性來改變您網站的外觀。

文字樣式 color:#fff;(文字顏色) font-family:Arial,Tahoma;(文字字型) font-size:16px;(文字大小) font-weight:bold;(文字粗體) font-variant:small-caps;(小字體) letter-spacing:1px;(文字間距) line-height:18px;(設定行高) text-decoration:line-through；(加上刪除線) text-decoration:overline；(加上頂線) text-decoration:underline;(加上底線) text-decoration:none;(刪除連結底線) text-transform:capitalize;(字首大寫) text-transform:uppercase;(英文大寫) text-transform:lowercase;(英文小寫) text-align:right;(文字靠右對齊) text-align:left;(文字靠左對齊) text-align:right;(文字靠右對齊) text-align:center;(文字置中對齊) text-align:justify;(文字分散對齊) text-align:sub;(下標字) vertical-align:super;(上標字) vertical-align:top;(垂直向上對齊) vertical-align:bottom;(垂直向下對齊) vertical-align:middle;(垂直置中對齊) vertical-align:text-top;(文字垂直向上對齊) vertical-align:text-bottom;(文字垂直向下對齊) word-spacing:5px;(設定詞的間距(詞間需有空白) word-wrap:break-word;(任意斷字，適用於英文) word-wrap:nowrap;(強制水平排序不斷行) 項目符號及編號 list-style-type:none;(不編號) list-style-type:disc;(實心圓形符號) list-style-type:circle;(空心圓形符號) list-style-type:square;(實心方形符號) list-style-type:decimal;(阿拉伯數字) list-style-type:lower-roman;(小寫羅馬數字*/ list-style-type:upper-roman;(大寫羅馬數字*/ list-style-type:lower-alpha;(小寫英文字母*/ list-style-type:upper-alpha;(大寫英文字母*/ list-style-image:url(dot.gif);(圖片式符號) list-style-position:outside;(凸排) list-style-position:inside;(縮排) 背景樣式 background-color:#F5E2EC;(背景色彩) background:transparent;(透視背景) background-image:url(image/bg.jpg);(背景圖片) background-attachment:fixed;(浮水印固定背景) background-repeat:repeat;(重複排列-網頁預設) background-repeat:no-repeat;(不重複排列) background-repeat:repeat-x;(在x軸重複排列) background-repeat:repeat-y;(在y軸重複排列) background-position:90%90%;(背景圖片x與y軸的位置) background-position:top;/*向上對齊) background-position:bottom;(向下對齊) background-position:left;(向左對齊) background-position:right;(向右對齊) background-position:center;(置中對齊) 滑鼠樣式變化 cursor:crosshair;(十字線型) cursor:n-resize;(箭頭朝上) cursor:s-resize;(箭頭朝下) cursor:e-resize;(箭頭朝右) cursor:w-resize;(箭頭朝左) cursor:nw-resize;(箭頭朝左上) cursor:sw-resize;(箭頭斜左下) cursor:se-resize;(箭頭斜右下) cursor:ne-resize;(箭頭朝右上) cursor:text;(輸入文字符號) cursor:help;(加一問號) cursor:wait;(等待中；漏斗) cursor:progress;(進行中；作業中) cursor:pointer;(手型，表示超連結) cursor:url("游標檔名.cur"),text;(游標圖案) 框線樣式 border-top:(上框線) border-bottom:(下框線) border-left:(左框線) border-right(右框線) border:(四邊框線) solid(實線框) dotted(虛線框) double(雙線框) groove(立體內凸框) ridge(立體浮凸框) inset(凹框) outset(凸框) 邊界樣式 a(放入所有超連結樣式) margin-top:10px;(上邊界) margin-right:10px;(右邊界值) margin-bottom:10px;(下邊界值) margin-left:10px;(左邊界值) margin:10px;(四邊邊界值) 物件定位 a(放入所有超連結樣式) position:static;(依照正常流程佈局) position:relative;top:10px;left:10px;(物件左上角開始位置) position:absolute;top:10px;left:10px;(網頁左上角開始位置) position:fixed;top:10px;left:10px;(固定在參考物上) 超連結連結樣式 a(放入所有超連結樣式) a:link(放入超連結文字樣式) a:visited(放入瀏覽過的連結文字樣式) a:active(放入按下連結的樣式) a:hover(放入滑鼠移至連結樣式) 相關資源‧章節/RELATED css基本觀念樣式指另 keyboard_backspace回上頁 網頁設計 請選擇下方類別，查看您想了解的「網頁設計」知識。

常用網頁設計美工軟體_photoshop28 常用網頁設計美工軟體_illustrator25 基本網頁設計17 何謂HTML4 認識CSS3 CSS基本觀念1 樣式指令1 常用語法1 網頁製作軟體介紹10