HTMLCSS學(xué)習(xí)筆記(四)-- CSS屬性

　　CSS屬性

　　屬性：屬性是指定選擇符所具有的屬性，它是css的核心，css2共有150多個(gè)屬性

　　屬性值：屬性值包括法定屬性值及常見的數(shù)值加單位，如25px，或顏色值等。

　　文本屬性

　　1:文本大小 font-size

　　說(shuō)明：

　　1) 屬性值為數(shù)值型時(shí)，必須給屬性值加單位，屬性值為0時(shí)除外。

　　2)單位還可以是pt，9pt=12px;

　　3)為了減小系統(tǒng)間的字體顯示差異，IE Netscape Mozilla的瀏覽器制作商于1999年召開會(huì)議，共同確定16px/ppi為標(biāo)準(zhǔn)字體大小默認(rèn)值,即1em.默認(rèn)情況下，1em=16px,0.75em=12px; rem

　　4)使用絕對(duì)大小關(guān)鍵字

　　xx-small =9px

　　x-small =11px

　　small =13px

　　medium =16px

　　large =19px

　　x-large =23px

　　xx-large =27px

　　2:文本顏色 color

　　說(shuō)明：

　　用十六進(jìn)制(是計(jì)算機(jī)中數(shù)據(jù)的一種表示方法)表示顏色值：

　　0 1 2 3 4 5 6 7 8 9

　　0 1 2 3 4 5 6 7 8 9 A B C D E F

　　顏色模式：光色模式

　　R G B

　　FF 00 00

　　顏色值的縮寫：

　　當(dāng)表示三原色的三組數(shù)字同時(shí)相同時(shí)，可以縮寫為三位;

　　當(dāng)用十六進(jìn)制表示顏色值時(shí)，需要在顏色值前加“#”

　　# fa 00 00

　　3:文本類型 font-family:字體1，字體2，字體3......

　　說(shuō)明：

　　瀏覽器首先會(huì)尋找字體1、如存在就使用改字體來(lái)顯示內(nèi)容，如在字體1不存在的情況下，則會(huì)尋找字體2，如字體2也不存在，按字體3顯示內(nèi)容，如果字體3 也不存在;則按系統(tǒng)默認(rèn)字體顯示;

　　當(dāng)字體是中文字體時(shí)，需加雙引號(hào);

　　當(dāng)英文字體中有空格時(shí)，需加雙引號(hào)如(“Times New Roman”)

　　當(dāng)英文字體只有一個(gè)單詞組成是不加雙引號(hào);如：(Arial);

　　Windows中文版本操作系統(tǒng)下，中文默認(rèn)字體為宋體或者新宋體，英文字體默認(rèn)為Arial.

　　4:文字加粗font-weight:bolder(更粗的)/bold(加粗)/normal(常規(guī))/100—900;

　　說(shuō)明：

　　在css規(guī)范中，把字體的粗細(xì)分為9個(gè)等級(jí)，分別為100——900，其中100對(duì)應(yīng)最輕的字體變形，而900對(duì)應(yīng)最重的字體變形，

　　100-400 一般 500常規(guī)字體 600-900加粗字體

　　5:font-style：italic/oblique/normal(取消傾斜，常規(guī)顯示);

　　說(shuō)明：

　　italic和oblique都是向右傾斜的文字, 但區(qū)別在于Italic是指斜體字，而Oblique是傾斜的文字，對(duì)于沒(méi)有斜體的字體應(yīng)該使用Oblique屬性值來(lái)實(shí)現(xiàn)傾斜的文字效果.

　　7:文字行高 {line-height:normal/value;}

　　說(shuō)明：

　　當(dāng)單行文本的行高等于容器高時(shí)，可實(shí)現(xiàn)單行文本在容器中垂直方向居中對(duì)齊;

　　當(dāng)單行文本的行高小于容器高時(shí)，可實(shí)現(xiàn)單行文本在容器中垂直中齊以上;

　　當(dāng)單行文本的行高大于容器高時(shí)，可實(shí)現(xiàn)單行文本在容器中垂直中齊以下(IE6及以下版本存在瀏覽器兼容問(wèn)題)

　　*文字屬性簡(jiǎn)寫：font:12px/24px "宋體";

　　font屬性的簡(jiǎn)寫：字號(hào)，行高，字體

　　font-size:12px; line-height:24px; font-family:”宋體”;

　　font屬性的簡(jiǎn)寫：

　　說(shuō)明:font的屬性值應(yīng)按以下次序書寫(各個(gè)屬性之間用空格隔開)

　　順序: font-style font-weight font-size / line-height font-family

　　注意：

　　(1)簡(jiǎn)寫時(shí) , font-size和line-height只能通過(guò)斜杠/組成一個(gè)值，不能分開寫。

　　(2) 順序不能改變 ,這種簡(jiǎn)寫法只有在同時(shí)指定font-size和font-family屬性時(shí)才起作用,而且,你沒(méi)有設(shè)定font-weight , font-style , 他們會(huì)使用缺省值(默認(rèn)值)。

　　8：水平對(duì)齊方式

　　text-align:left/right/center/justify(兩端對(duì)齊中文不起作用)

　　9:文本修飾text-decoration:

　　說(shuō)明：

　　none:沒(méi)有修飾

　　underline:添加下劃線

　　overline:添加上劃線

　　line-through:添加刪除線

　　10:首行縮進(jìn)

　　1)text-indent可以取負(fù)值;

　　2)text-indent屬性只對(duì)第一行起作用。

　　11:字間距、詞間距

　　字間距{letter-spacing:value;}控制英文字母或漢字的字距。

　　詞間距{word-spacing:value;}控制英文單詞詞距。

　　列表屬性

　　1、定義列表符號(hào)樣式

　　list-style-type：disc(實(shí)心圓)/circle(空心圓)/square(實(shí)心方塊)/none(去掉列表符號(hào));

　　list-style-type:none===list-style:none;

　　2、使用圖片作為列表符號(hào)

　　list-style-image：url(所使用圖片的路徑及全稱);

　　3、定義列表符號(hào)的位置

　　list-style-position:outside(外邊)/inside(里邊);

　　list-style:none;去掉列表符號(hào)

　　邊框?qū)傩?/strong>