項目 | 變數 | 參數 | 範例 |
字體顏色 | color | 關鍵字
#rgb (以16個色階來設定)
#rrggbb (以32個色階來設定)
rgb(n%,n%,n%)
rgb(n,n,n) | color:gray
color:#DE0
color:#FF0000
color:rgb(100%,60%,20%)
color:rgb(128,0,128) |
水平對齊 | text-align | left
center
right | text-align:center |
設定文字分散對齊 | text-justify | auto
distribute-all-lines (分散對齊) | text-justify:distribute-all-lines |
段落縮排 | text-indent | 數值+%
數值+單位 (px,cm,em) | text-indent:20% |
垂直對齊 | vertical-align | baseline (一般位置)
super (上標)
sub (下標)
top
middle
botton | vertical-align:top |
設定英文大小寫 | text-transform | capitalize (第一個為大寫)
uppercase (皆大寫)
lowercase (皆小寫)
none (預設) | text-transform:capitalize |
調整字元間距 | letter-spacing | normal
數字+單位 (pt , px , em , 亦可為負值) | letter-spacing:5pt |
調整單字間距
只有Netscape支援 | word-spacing | normal ;
數字+單位 (pt , px , em) | word spacing:7pt |
設定文字效果 | text-decoration | none
overline (上線)
underline (底線)
line-throughx (刪除線)
blink (閃爍效果) | text-decorationverline underline
訪客無法瀏覽此圖片或連結,請先 註冊 或 登入會員 。 |
設定空白或換行 | white-space | normal
pre (顯示輸入的換行,space,tab.IE不支援)
nowrap (不會自動換行) | white-space:nowrap儲純格內無法換行 |
避頭尾字元 | line-break | normal (要看瀏覽器支援與否)
strict (日文小的片假名,平假名或長音-不得至於行頭) | style="line-break" |
單字中的換行處理 | word-break | normal
break-all (英文中,到畫面右邊就換行,不保持單字完整性)
keep-all (中文中,保持單字或句子完整性.只是用於中日韓文) | word-break:keep-all (中文中,保持單字或句子完整性.只適用於中日韓文) |
指定在單字中換行 | word-wrap | normal
break-word (讓無法自動換行的單字進行自動換行) | word-wrap:word-wrap thisisoursampleisitlongenough |
以直書方式顯示
Netscape 不支援 | writing-mode | lr-tb 橫書
tb-rl 直書 | writing-mode:tb-rl 直書 |
設定底線位置
此功能可用overline取代 | text-underline-position | below (底線在下或在左)
above (底線在上或在右) | text-underline-position:below 直書 |
調整標注符號的位置
只適用於<Ruby>標籤 | ruby-align | auto
left (從左端開始標注)
center (從中間開始標注)
right (從右端開始標注)
distribute-letter (平均地標注)
distribute-space (平均地標注,且空間足夠時會在左右再留一些空白.空間不足時兩者效果是一樣的.)
line-edge (只有在最左方或最右方有要標注的文字時,標注符號會從該文字的另一方開始標注) | 左端標注left
中間標注center
右端標注right
平均地標注ruby-align:distribute-letter
平均地標注,且空間足夠時會在左右再留一些空白ruby-align:distribute-space
edge標edge注
edge標注edge |
標注符號的位置 | ruby-positon | above (置於文字之上,預設值)
inline (至於文字之後) | 標注在後inline |
將文字調整收編在格線內的方法 | layout-grid-type | loose (不改變字型,紙漿字與自之間空開.預設值)
fixed (僅對中日韓設定為一樣的字型大小,再調整收標於格線內)
strict (將所有字型都設定為一樣的字型大小,再調整收標於格線內) | layout-grid-type:loose;layout-grid-line:20px;layout-grid-char:20px |
字元,單行間距 | layout-grid-char
layout-grid-line | none (預設值)
auto (自動設定格線大小)
文字大小的數值+單位 (無法指定為負值,px,pt,em)
數值+% (無法指定為負值) | 調整單行距離
layout-grid-type:loose;layout-grid-line:40px;layout-grid-char:20px;layout-grid-mode:line |
對齊格線的方向 | layout-grid-mode | none (不與格線對齊)
both (縱向,橫向都與格線對齊)
line (只有縱向對齊)
char (只有橫向對齊) | 調整字元距離
layout-grid-type:loose;layout-grid-line:20px;layout-grid-char:10px;layout-grid-mode:char |
統一對格線的指定 | layout-grid | 依序為 mode , type , line , char 的值 | layout-grid:loose 15px 20px both |