PHILIP SU的PIXNET小站

 
部落格欄內背景
一般只能設定顏色或是靜態圖片

*****************************************************************************************

■轉換英文字母大小寫 text-transform
語法如下：
{text-transform:屬性值;}
屬性值有以下四種～
⊙ uppercase - 將網頁所有英文字母轉為大寫
⊙ lowercase - 將網頁所有英文字母轉為小寫
⊙ capitalize - 將網頁所有英文單字的第一個字母轉為大寫
⊙ none -  恢復原本大小寫狀態

■選擇字型 font-family
系統預設的字型一般為新細明體或細明體,
為展現網頁不同風格, 常會想選用其他字型,
而CSS使用font-family語法來指定其他字型,
其語法如下：
{font-family:字型名稱1,字型名稱2,....字型名稱n;}
字型選用優先次序由字型名稱1到字型名稱n,
當對方電腦都無以上選用字型時,
則以新細明體或細明體之預設字型顯示.

■ 改變字體大小 font-size
CSS使用該指令來設定文字大小, 可採用絕對大小及相對大小來設定～
絕對大小可用數值加上度量單位來表示(注意兩者間不要有空格),
例如 font-size: 20px
常見的度量單位有：

px (pixel)-圖點

pt (point)-點數. 印刷時所用度量單位,  1pt=1/72 inch.

pc (picas)-印刷時所用度量單位,  1pc=12 pts.

mm (milli-meter)-公釐

cm (centi-meter)-公分

in (inch)-英吋. 1 inch=2.54 cm.

這些度量單位在不同電腦螢幕上顯示可能會有大小差異,
這是因為電腦螢幕解析度(DPI, Dots per Inch)不同所致,
例如72DPI及85DPI的解析度就相差13px.
除了數值加上度量單位的方式外,  CSS也預設了7級文字大小,
分別為xx-small, x-small, small, medium, large, x-large, xx-large.
至於相對大小的的用法, 就是以目前文字(繼承文字或預設文字)大小為參考基準,
然後設定成基準的若干倍大小. 常見的語法如下：

em-代表從上層元素繼承的文字大小

em的用法以2 em (即 font-size:2em)來說明,

 若上層文字大小是20px, 則2em就是40px了！

ex-與em類似, 只是改以目前字形的小寫x字母為參考大小.

%-與em類似, 代表上層元素繼承的文字大小的倍率.

100％等同於1 em , 200%等同於2 em 以此類推,

 若上層文字大小是20px, 則200％就是40px了！

smaller or larger- 與em類似, 代表上層元素預設的文字大小的倍率.

若上層文字大小是xx-small,

則font-size:larger文字大小就是x-small了！