国产色在线视频-国产色综合一区二区三区-国产身材极品喷水 在线播放-国产深夜福利视频观看-国产深夜福利视频在线-国产深夜福利视频在线播放

css個(gè)人總結(jié)

2016/9/12 8:37:27   閱讀:1330    發(fā)布者:1330

1.什么是css,指的是疊層樣式表,控制網(wǎng)頁(yè)的的外觀顯示。

2.引入css的三種方式,外部鏈接,內(nèi)部鏈接,內(nèi)聯(lián),分別的語(yǔ)法是,<link rel="stylesheec" type="text/css"
href=""/>,<style type="tex/css"></style>,style="屬性:值"

3.css選擇器,選擇器就是要針對(duì)你要所改變的元素,而單獨(dú)定義的樣式,就常見(jiàn)的選擇器:ID,CLASS,
元素選擇器,子元素選擇器,群組選擇器,相鄰選擇器,id選擇器是唯一的意思是,只能定義一個(gè)id名相同的,
class選擇器,類(lèi)選擇器,可以為多個(gè)元素定義,id選擇器和class選擇器的區(qū)別在于,id是唯一的就像每個(gè)人的身份證一樣只有一份號(hào)碼是唯一的,
而class就是像每個(gè)人的名字一樣可以重復(fù),元素選擇器就是選澤要改變的元素標(biāo)簽名字,子選擇器就是在當(dāng)前元素后的子元素,
群組合選擇器就是選澤所有想改變的元素,相鄰選擇器就在當(dāng)前同級(jí)元素的下一個(gè)元素。

語(yǔ)法:<p id="one">這是一個(gè)段落</p>  相應(yīng)的  css規(guī)則: #id{ 屬性:值}

        <p class="two"></p><p
class="two"></p>相應(yīng)的css規(guī)則:.class{ 屬性:值}

        <p>這是一個(gè)段落</P> 相應(yīng)的css規(guī)則:p{屬性:值}

       <div><p>這是一個(gè)段落奧</P></div>
相應(yīng)的css規(guī)則:div p{屬性:值}

      <div><p>這是一個(gè)段落奧</P></div>
相應(yīng)的css規(guī)則:div,p{屬性:值}

    <div>

<p>這是一個(gè)段落奧</P>相應(yīng)的css規(guī)則:div+div{屬性:值}

  </div>

  <div>

<p>這是一個(gè)段落奧</P>

  </div>

4.字體樣式

字體的類(lèi)型:font-family:  ’’;取值宋體,微軟雅黑等、

字體的大小:font-size:;通常以像素值px,其他的還有em ,百分比

字體的粗細(xì):font-weight:;取值bold粗體顯示,normal正常

字體的樣式:font-style:;italic斜體,normal正常

顏色;color;

行高:line-height:;字體的行高,一行的高度不是距離。

5.文本樣式

文本裝飾:text-decoration:;取值有,line-through(貫穿線(xiàn)),underline(下劃線(xiàn)),overline(上劃線(xiàn))

文本對(duì)齊:text-align:;取值有,center(居中),left(左對(duì)齊),right(右對(duì)齊)

文本縮進(jìn):text-ident:;取值單位px.em,百分比

文本大小寫(xiě):text-transform:;取值有 uppercase(大寫(xiě)) lowercase(小寫(xiě)) capitalize(首指母大寫(xiě))

文本的字間距:letter-sapcing:;取值單位px ,em ,百分比

詞間距:word-sapcing:;取值單位px ,em ,百分比

6.邊框

border邊框 邊框的大小 類(lèi)型 顏色 分別的設(shè)置

border-width:; 取值是單位px   em  百分比

border-style:; 取值是solid 實(shí)線(xiàn)  dashed虛線(xiàn) 等

border-color:;取值顏色 ,可以是十六進(jìn)制。

7.背景 

背景圖片,背景是否被重復(fù) ,背景的位置,背景是否滾動(dòng)  分別是

background:URL; 

background-repeat:;取值有,repeat(重復(fù)) no-repeat(不重復(fù)) repeat-x(x軸重復(fù)) repeat-y(y軸重復(fù))

background-position:;取值可以是   center left right top

background-scroll:;  取值是scroll   fixed

 

可以簡(jiǎn)寫(xiě);background: URL  repeat   position  scroll;

 

 

8.超鏈接樣式

當(dāng)我們鼠標(biāo)移動(dòng)到a標(biāo)簽上面,可以讓他顯示的樣式,通過(guò)偽類(lèi)來(lái)設(shè)置,不一定是a元素才有可以設(shè)置,
在html中 任何元素可以都已設(shè)置偽類(lèi)。語(yǔ)法:元素:hover

當(dāng)鼠標(biāo)未訪(fǎng)問(wèn)的樣式a:link;,當(dāng)鼠標(biāo)訪(fǎng)問(wèn)后的樣式a:visited;當(dāng)鼠標(biāo)移動(dòng)到的樣式a:hover;
當(dāng)鼠標(biāo)按下時(shí)的樣式a:active;

9圖片

圖片大小:可以通過(guò)設(shè)置它的寬度 高度來(lái)設(shè)置。

圖片位置:通過(guò)text-align(水平居中),vertical-aligin(垂直居中)

圖片邊框:通過(guò)border來(lái)設(shè)置它的邊框

10列表

列表的樣式:list-style-type:;取值none,circle,等

列表圖片:list-style-image:;

11表格

表格默認(rèn)是沒(méi)有邊框的,我要通過(guò)border給它值

12,盒子模型

盒子模型分為:內(nèi)容區(qū),內(nèi)邊距,外邊距,邊框

13布局

浮動(dòng)布局:通過(guò)float浮動(dòng)塊元素,注意清除浮動(dòng)。

定位布局:position來(lái)設(shè)置。然后設(shè)置。上右下左的值。

固定定位:position:fixed/scroll

靜態(tài)定位:position:static