資源描述：
《html+css的文檔筆記》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫。
1、CSS簡介一、CSS簡單介紹：a)Csscascadingstylesheets層疊樣式表b)Css的主要目的：是給HTML標(biāo)記添加各種各樣的表現(xiàn)(格式、樣式)比如：文字樣式，背景，文本樣式，連接樣式c)提示：css是給HTML標(biāo)記加的樣式；js是給HTML標(biāo)記加的行為。HTML標(biāo)記是最先出現(xiàn)的d)HTML超文本標(biāo)注語言：各種HTML標(biāo)記e)Css層疊樣式表：給HTML標(biāo)記加的樣式f)JavaScript腳本程序：給HTML標(biāo)記加的程序。h1{color:red;font-size:14px;}選擇器聲明聲明屬性值屬性值二、Css語法格式a)b)一個(gè)CSS規(guī)則，由“選擇器”和“格式聲明語句”
2、構(gòu)成c)“選擇器”：就是選擇HTML標(biāo)記，換句話說：就是給那個(gè)HTML語句加樣式d)“格式生命語句”：由{}構(gòu)成，{}中是各種格式語句。e)一條格式語句，由“屬性名：屬性值”構(gòu)成f)每一條格式語句，必須用英文下的分號(hào)“；”結(jié)束。g)屬性名，就是CSS的各種屬性，這些屬性名都是固定值h)屬性值，一個(gè)屬性名可以去不同的值，這個(gè)值不加引號(hào)。i)CSS中數(shù)字單位都是px，著個(gè)px不能省略三、CSS選擇器a)基本選擇器l“*”選擇器：通配符1.描述：將匹配所有的HTML標(biāo)記，所有的標(biāo)記都會(huì)改變的2.語法：*{color：red；}3.注意：“*”盡量少用，因?yàn)镮E6不支持l標(biāo)簽選擇器1.描述：將匹配指
3、定的HTML標(biāo)記2.語法：h1{color：red}3.注意：CSS標(biāo)簽選擇器，與HTML標(biāo)記一樣，但是不能加尖括號(hào)lClass選擇器（類選擇器）-類選擇器是使用頻率最高的1.描述：給一類HTML標(biāo)記加樣式。這里所指的“一類”是：每個(gè)HTML標(biāo)記都有一個(gè)Class屬性，且Class值一樣。Class屬性是公共屬性，每個(gè)標(biāo)記都有這個(gè)屬性2.類選擇器的名稱，必須以“.”開頭，后跟HTML標(biāo)記的class屬性的值。如：.box{color：red；}3.HTML標(biāo)記的Class屬性的值，不能以數(shù)字開頭lID選擇器1.描述：個(gè)指定ID的元素添加樣式。2.注意:網(wǎng)頁中HTML標(biāo)記的ID屬性的值，必須唯
4、一的3.每一個(gè)HTML標(biāo)記都有一個(gè)id的公共屬性。4.注意：id屬性一般是給Js用的，不是讓你來加樣式的，class屬性只能給CSS樣式的不能給Js用5.Id選擇器的名稱，必須以“#”開頭，后跟HTML屬性的值l組合選擇器1.多元素選擇器a)描述：給多個(gè)元素加同一個(gè)樣式多個(gè)選擇器之間用“，”隔開b)舉例：h1,p,div,body{color：red；}l后代元素選擇器（最常用）1.描述：給某個(gè)標(biāo)簽的某一個(gè)后代加元素樣式。選擇器用“空格”隔開2.舉例：div.title{color：red}l子元素選擇器1.描述：給某個(gè)元素的子元素添加樣式2.舉例：div>h1.title（color：re
5、d）lCSS選擇器-基本選擇器（單個(gè)選擇器）1.通配符“*”：將匹配所有的HTML標(biāo)記，只要
中存在的標(biāo)記都會(huì)生效2.標(biāo)簽選擇器：對(duì)應(yīng)于HTML標(biāo)記，有什么樣的HTML標(biāo)記，就有什么樣的鏢旗選擇器。如：p{color：red}3.類選擇器：給HTML標(biāo)記中，class屬性值相同的元素，添加樣式。命名必須以“.”開頭。如：.news{}4.Id選擇器：給HTML標(biāo)記中，具有一id屬性的元素，添加樣式。唯一性。命名以“#”開頭。如：#news{}lCSS選擇器-咋和選擇器（多個(gè)選擇器）1.多元素選擇器：同時(shí)給多個(gè)元素添加樣式，各個(gè)選擇之間用逗號(hào)“，”分開。如：p,h1,#box{}1.
6、后代元素選擇器：給某個(gè)元素的子元素添加樣式。用空格隔開。如：#boxh1{}2.子元素選擇器：給某個(gè)元素的子元素添加樣式。用“>”隔開。如：#box>h1{}一、CSS尺寸屬性a)Width：元素寬度，一定要加px單位b)Height：元素高度。二、CSS字體屬性a)Font-size：文字大小。如：font-size：14px；b)Font-family：字體。如：font-family：微軟雅黑；c)Font-style：斜體，取值：italic。如：font-style：italic；d)Font-weight：粗體，取值：bold。如：font-weight：bold；三、CSS文本
7、屬性a)Color：文本顏色b)Text-decoration：文本修飾線，取值：none(無)，underline（上劃線），line-through（刪除線）c)Text-align：文本水平對(duì)齊方式，取值：left，center，rightd)Line-height：行高，可以用固定值，也可以用百分比。如：line-height：24px；line-height：150%；e)Text-indent：首
