close
CSS串聯樣式表教學『文字屬性一覽』
color : #999999; /*文字色彩*/
font-family : 細明體,sans-serif; /*文字字型*/
font-size : 9pt; /*文字大小*/
font-style:italic; /*文字斜體*/
font-variant:small-caps; /*小字體*/
letter-spacing : 1pt; /*字間距離*/
line-height : 200%; /*設定行高*/
font-weight:bold; /*文字粗體*/
vertical-align:sub; /*下標字*/
vertical-align:super; /*上標字*/
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:center; /*文字置中對齊*/
text-align:justify; /*文字分散對齊*/
word-spacing : 5px; /*半形空格的間距*/
New vertical-align屬性
vertical-align:top; /*垂直向上對齊*/
vertical-align:bottom; /*垂直向下對齊*/
vertical-align:middle; /*垂直置中對齊*/
vertical-align:text-top; /*文字垂直向上對齊*/
vertical-align:text-bottom; /*文字垂直向下對齊*/
語法貼於之間
CSS串聯樣式表教學『游標連結屬性一覽』
color : #999999; /*文字色彩*/
font-family : 細明體,sans-serif; /*文字字型*/
font-size : 9pt; /*文字大小*/
font-style:italic; /*文字斜體*/
font-variant:small-caps; /*小字體*/
letter-spacing : 1pt; /*字間距離*/
line-height : 200%; /*設定行高*/
font-weight:bold; /*文字粗體*/
vertical-align:sub; /*下標字*/
vertical-align:super; /*上標字*/
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:center; /*文字置中對齊*/
text-align:justify; /*文字分散對齊*/
word-spacing : 5px; /*半形空格的間距*/
New vertical-align屬性
vertical-align:top; /*垂直向上對齊*/
vertical-align:bottom; /*垂直向下對齊*/
vertical-align:middle; /*垂直置中對齊*/
vertical-align:text-top; /*文字垂直向上對齊*/
vertical-align:text-bottom; /*文字垂直向下對齊*/
語法貼於之間
語法貼於之間
這是文字屬性樣式.body定義的樣式顯示在這 選擇器.font定義的樣式顯示在這裡
|
CSS串聯樣式表教學『游標連結屬性一覽』
a /*所有超連結*/
a:link /*超連結文字格式*/
a:visited /*瀏覽過的連結文字格式*/
a:active /*按下連結的格式*/
a:hover /*滑鼠移至連結*/
滑鼠游標樣式:
作業中 cursor:progress
十字型 cursor:crosshair
箭頭朝上 cursor:n-resize
箭頭朝下 cursor:s-resize
十字箭頭 cursor:move
箭頭朝右 cursor:e-resize
箭頭朝左 cursor:w-resize
加一問號 cursor:help
箭頭朝左上 cursor:nw-resize
箭頭斜右下 cursor:se-resize
文字I型 cursor:text
箭頭斜左下 cursor:sw-resize
箭頭朝右上 cursor:ne-resize
漏斗 cursor:wait
手型(IE6) cursor:pointer
無法使用(IE6) cursor:not-allowed
游標圖案(IE6) p {cursor:url("游標檔名.cur"),text;}
連結樣式範例
套用"文字屬性"來做超連結的效果 套用"邊框屬性"來做超連結的效果 連結樣式範例三之立體按鈕效果 |
全站熱搜
留言列表