1.CSS的顏色表示
命名顏色
red欺抗、black售碳、white、purple绞呈、green贸人、yellow、silver佃声、gray艺智、teal、blue圾亏、navy....[備注]
p { color: red;}
RGB顏色表示法
RGB模式表示色彩十拣,R:red,G:green志鹃,B:blue夭问,三種顏色組合疊加可以產生自然界中所有的顏色,也是計算機常用模式曹铃。
RGB 顏色值是這樣規(guī)定的:rgb(red, green, blue).
每個參數(shù) (red缰趋、green 以及 blue) 定義顏色的強度,可以是介于 0 與 255 之間的整數(shù),或者是百分比值(從 0% 到 100%)埠胖。
p { color: rgb(255,255,0); };
p { color: rgb(100%,100%,0%); };
十六進制顏色值
由于RGB模式書寫非常不方便糠溜,三個255值直接用3個十六進制數(shù)表示。
十六進制顏色是這樣規(guī)定的:#RRGGBB直撤,其中的 RR(紅色)非竿、GG(綠色)、BB(藍色)十六進制整數(shù)規(guī)定了顏色的成分谋竖。所有值必須介于 0 與 FF 之間红柱。
取值范圍 #000000 ~ #FFFFFF (黑色到白色)
其實就是RGB模式的另外一種寫法,所有瀏覽器都兼容蓖乘。
p { color: #c0c0c0; }? p { color: #c09; }? 三個數(shù)字的復制擴展成六個 #c09=>#cc0099锤悄。
1.2CSS的長度單位
絕對長度單位:
cm:厘米,mm:毫米嘉抒,in:英寸零聚,pc:派卡(Picas),相當于我國新四號鉛字的尺寸些侍。都不常用隶症,了解即可。
相對長度單位:
px:像素點岗宣,像素就是顯示器顯示的一個點蚂会。
em:1em 等于當前的字體大小,例如:當前元素的字體大小為16px耗式,那么1em = 16px胁住。
單位之間的關系:1in = 2.54cm = 25.4 mm? = = 96px
p { width: 1in; height:20px; }
1.3CSS字體樣式屬性
1、font-size:字號大小
font-size屬性用于設置字號刊咳,該屬性的值可以使用相對長度單位彪见,也可以使用絕對長度單位。
其中娱挨,相對長度單位比較常用企巢,推薦使用像素單位px,絕對長度單位使用較少让蕾。
可選參數(shù)值:xx-small | x-small | small | medium | large | x-large | xx-large|smaller | larger
一般頁面中:12px? ? ? 14px? 12cm
1em
例如:
p { font-size: 32px; }
1.3.2浪规、font-family:字體
font-family屬性用于設置字體。網頁中常用的字體有宋體探孝、微軟雅黑笋婿、黑體等,例如將網頁中所有段落文本的字體設置為微軟雅黑顿颅,可以使用如下CSS樣式代碼:
可以同時指定多個字體缸濒,中間以逗號隔開,表示如果瀏覽器不支持第一個字體,則會嘗試下一個庇配,直到找到合適的字體斩跌。如果字體名稱包含空格或中文,則應使用引號括起
例如:font-family:Verdana, Arial, '宋體';
使用font-family設置字體時捞慌,需要注意以下幾點:
各種字體之間必須使用英文狀態(tài)下的逗號隔開耀鸦。
中文字體需要加英文狀態(tài)下的引號,英文字體一般不需要加引號啸澡。當需要設置英文字體時袖订,英文字體名必須位于中文字體名之前。
如果字體名中包含空格嗅虏、#洛姑、$等符號,則該字體必須加英文狀態(tài)下的單引號或雙引號皮服,例如font-family: "Times New Roman";楞艾。
盡量使用系統(tǒng)默認字體,保證在任何用戶的瀏覽器中都能正確顯示
使用font-family設置字體時龄广,需要注意以下幾點:
在 CSS 中設置字體名稱硫眯,直接寫中文是可以的。但是在文件編碼(GB2312蜀细、UTF-8 等)不匹配時會產生亂碼的錯誤。
為此戈盈,在 CSS 直接使用 Unicode 編碼來寫字體名稱可以避免這些錯誤奠衔。使用 Unicode 寫中文字體名稱,瀏覽器是可以正確的解析的塘娶。
font-family: "\5FAE\8F6F\96C5\9ED1"归斤,表示設置字體為“微軟雅黑”。
可以通過escape()? 來得到
1.4字體系列
西方國家字母體系分為兩類:serif以及sans serif刁岸。
serif是有襯線字體脏里,意思是在字的筆畫開始、結束的地方有額外的裝飾虹曙,而且筆畫的粗細會有所不同迫横。相反的,sans serif就沒有這些額外的裝飾酝碳,而且筆畫的粗細差不多矾踱。
為了更安全的設置:
font-famliy:? tahoma,arial,'Hiragino Sans GB',\5b8b\4f53,sans-serif;
前面的字體都查找失敗后,在系統(tǒng)中找一種sans-serif字體作為默認字體疏哗。
注意順序呛讲,如果把sans-serif放前面去,后面的都失效了
1.4.2、font-weight:字體粗細
font-weight屬性用于定義字體的粗細贝搁,其可用屬性值:normal吗氏、bold、bolder雷逆、lighter弦讽、100~900(100的整數(shù)倍),有繼承性关面。
400 : Normal
700:bold
字體的加粗跟字體有關坦袍,比如:一種字體只有兩種粗細程度的變化,那么normal 到bold 和到bolder都是一樣的效果等太。
1.4.3捂齐、font-style:字體風格
font-style屬性用于定義字體風格,如設置斜體缩抡、傾斜或正常字體奠宜,其可用屬性值如下:
normal:默認值,瀏覽器會顯示標準的字體樣式瞻想。
italic:瀏覽器會使用斜體的字體樣式顯示压真,如果字體沒有斜體,那么正常顯示字體蘑险。
oblique:瀏覽器會讓文字傾斜顯示滴肿。
1.4.4、font:綜合設置字體樣式
font屬性用于對字體樣式進行綜合設置佃迄,其基本語法格式如下:
使用font屬性時泼差,必須按上面語法格式中的順序書寫,各個屬性以空格隔開呵俏。
其中不需要設置的屬性可以省略(取默認值)堆缘,但必須保留font-size和font-family屬性,否則font屬性將不起作用普碎。
淘寶的字體設置:font: 12px/1.5 tahoma,arial,'Hiragino Sans GB',\5b8b\4f53,sans-serif;