cs 有許多樣式文本的屬性,本節主要是使用css來控制文本的 字體,格式 ,顏色,文本修飾等
一:改變字體和指定字體外觀的屬性
1: 用font-family屬性定義網頁中的字體,每個font-family包括一系列具相同特征的字體
字體系楊浦五種: sans-serif ‚serif monospace cursive和fantasy. 而每個系有包括許多字體
Sans-serif Family 系列是沒有襯線的字體 在電腦頻幕上這些字體要比Serif字體更具可讀性 Ssrif 系列是有襯線(指字母主線端的短細線)的字體,一般用於報紙印刷 Monospace Family系列的字母具有相同寬度。這些字體主要用來顯示軟件代碼實例 Cursive 系列是一些看起來像是手寫的字體,有時用於標題 Fantasy 系列是一些有固定裝飾的字體,這些字體並不多見,在規范Web設計中不常用。 body{ font-family: Verdana, Geneva, Arial, sans-serif; }
2:用font-size屬性控制字體大小
body{ font-size: 14px;(使用像素) 百分數用與別的字體大小的相對值來定義字體大小<font-size: 150%;> 還可以用em 定義字體大小 用“em ” 是制定比例因數 <font-size:1.2em;> 還有一種就是關鍵字 <font-size: small;> }
3: 用color屬性給文本添加顏色
body{ color: silver;(用詞來指定顏色) }
4:font-weight屬性設置字體的粗細
body{ font-weight: bold, lighter, normal, bolder; }
5:用text-decoration屬性給文本添加更多樣式。
應用text-decoration屬性,可以用overlines,underlines和line-thoughs等來修飾文本
body{ text-decoration: underline; }
二:給字體添加樣式
italic(斜體) 文本 是向右傾斜的有時候多一些彎曲的襯線,可以用font-style屬性在css中給文本添加斜體(italic)樣式:
Italic和oblique是讓字體傾斜顯示的兩種格式。
font-style: italic;
有的字體並不支持italic(斜體)格式,就用oblique斜體文本代替。oblique也是傾斜的,不過字體不是專門設計的傾斜字母,瀏覽器只是把普通字母傾斜顯示了
font-style: oblique;
三: 如何制定Web 顏色?方法有。。。
1. 可以用顏色名直接定義(17中顏色)17種顏色名預先定義了紅色,綠色和藍色三原色的比例
在css中可以這么寫
body { background-color: silver;(css顏色名不分大小寫) } ↓寫顏色名
2. 可以根據紅,綠,藍的相對百分比來定義顏色
3. 可以用十六進制代碼定義——(是描述紅,綠,藍成分多少的簡略表達法) (常用)
(1) 十六進制代碼是以#開頭的如 #cc6600. 則
前兩位代表紅色,中間代表綠色,最后兩位代表藍色。
(2) 十六進制代碼基於16個數字(0-f)的。用十六進制,從0到15只需以為數就夠了,9以上用字母
如看到“b” 就知道是代表11
(3) 把十六進制顏色分成三部分: 每個十六進制顏色都由紅色,綠色,藍色三部分組成。
# cc 66 00
↓紅 綠 藍
把每個十六進制數轉化成相應的十進制數 每部分的值都可以換算成0—255的一個數。
cc--
↓12×16=192 192+12=204——十六進制的204等於十六進制的CC
下面的也這么算 (6x16)+6=102 (0x16)+0=0
完成
四: 關於text-decoraions的所有內容《含有下划線》
文本修飾允許你在瀏覽器,閃爍文本中添加一些underlines,overlines, line-throughts之類的修飾效果。
要添加文本修飾,只要在元素中設置tex-decorations屬性便可
em{ text-decoration: line-through; }這條規則將會使元素<em>d的文本中央有條線穿過 如果文本繼承了你不想要的文本修飾,用“none”就可以去掉 em{ text-decoration: none;(文本就沒有修飾了) }
五:行間距
line-height屬性可以定義文本的行間距 可以像其他與字體有關的屬性一樣,也可以用像素,em或百分數等與字體大小有關的值定義行間距
