css知識點匯總_第1頁
css知識點匯總_第2頁
css知識點匯總_第3頁
css知識點匯總_第4頁
全文預覽已結束

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

1、CS坤習知識點1、css是什么？CSS(CascadingStyleSheet)可譯為“層疊樣式表"或"級聯(lián)樣式表”，它定義如何顯示HTML元素，用于控制網(wǎng)頁的外觀。2、為什么使用css,優(yōu)點是什么？1：【內容】和【表現(xiàn)】相分離HTM戊件中只存放文本信息，將樣式部分放在一個獨立樣式文件中。頁面對搜索引擎更加友好。2:提高頁面瀏覽速度采用CSS布局的頁面容量要比TABLED局的頁面文件容量小得多，前者一般只有后者的1/2大小。3:易于維護和改版只要簡單的修改對應CSS文件，就可以重新設計整個網(wǎng)站的頁面。4:使用CSS布局更符合現(xiàn)在的亞3瓶準W3C組織是對網(wǎng)絡標準制定的一個非贏

2、利組織，像HTML、CSS、XML的標準就是由它來定制。3、CSS樣式表的調用方式哪幾種？1、內部樣式：把CSS樣式表放到<head>文檔中：格式如下：<styletype="text/css”></style>2、內聯(lián)式：把CSS樣式表寫在HTML對應的標記內。格式如下：<pstyle="font-size:14pt;color:blue”>藍色14號文字</p>3、外部樣式：把編輯好的CSS文檔保存成“.CSS”文件，然后在<head>中定義。格式如下：<head><linkrel

3、=stylesheethref="css的文件地址">.</head>4、導入樣式：與鏈入外部樣式的功能基本相同，只是語法和實現(xiàn)方式上有差別。格式如下：<style>importurl(css.css);</style>4、幾種調用方式的優(yōu)先級？從高到低：內聯(lián)樣式外部樣式內部樣式導入樣式5、CSS的語法：CSS的定義是由三部分構成：選擇器，屬性和屬性值。語法：selectorproperty:value;選擇符屬性:值舉例：bodycolor:#006666;font-size:18px;屬性和屬性值之間是冒號，多個屬性值之間用分號

4、隔開。6、css選擇器分類1、類選擇器定義：類選擇器根據(jù)類名來選擇，前面以".”來命名，如.democolor:#FF0000;使用方法：在HTML中，標記可以定義一個class的屬性來調用。如<pclass="demo">.</p>2、id選擇器定義：根據(jù)元素ID來選擇元素，具有唯一性。前面以"#號來標志，如：#democolor:#FF0000;使用方法：在HTML中，標記可以定義一個id的屬性來調用。如<pid="demo">.</p>3、標簽選擇器定義：HTML頁面是有很多不同的

5、標簽組成，標簽選擇器，則是決定對應標簽采用相應的CSS樣式。使用方法：pfont-size:12px;background:#900;color:090;,頁面里對應的p標記全部應用此樣式。4、偽類選擇器（針對超鏈接）一般偽類都只會被應用在鏈接的樣式上，格式如下：a:linkcolor:#000099;帶有超鏈接的文字顯示的樣式。a:visitedcolor:#000099;訪問過的超鏈接顯示的樣式。a:hovercolor:#000099;鼠標放在超鏈接上顯示的樣式。a:activecolor:#000099;鼠標按下去是超鏈接顯示樣式。acolor:#000099;標簽選擇器，鏈接的顏色。

6、5、后代選擇器（派生選擇器）通過依據(jù)元素在其位置的上下文關系來定義樣式，可以使標記更加簡潔。#demopcolor:#ff0000;size:14px;6、通用選擇器通用選擇器用*來表示。例如：*font-size:12px;表示所有的元素的字體大小都是12px。7、并集選擇器（群組選擇器）當幾個元素樣式屬性一樣時，可以共同調用一個聲明，元素之間用逗號分隔。比如：p,td,liline-height:20px;color:#ff0000;7、常用CSS縮寫語法在網(wǎng)頁設計中使用css縮寫可以幫助減少你CSS文件的大小，更加容易閱讀。css縮寫的主要規(guī)則如下:一、顏色16進制的色彩值，如果每兩位的

7、值相同，可以縮寫一半，例如：#000000可以縮寫為#000;#336699可以縮寫為#369;二、盒尺寸通常有下面四種書寫方法：property:value1;表示所有邊都是一個值valuel;property:value1value2;表示top和bottom的值是value1,right和left的值是value2property:value1value2value3;表示top的值是value1,right和left的值是value2,bottom的值是value3property:value1value2value3value4;四個值依次表示top,right,bottom,lef

8、t方便的記憶方法是順時針：上、右、下、左。具體應用在margin和padding的例子如下：margin:1px02px5px;三、邊框（border）邊框的屬性如下：border-width:1px;邊框寬度border-style:solid;邊框樣式（實線，虛線等）border-color:#000;邊框顏色可以縮寫為一句：border:1pxsolid#000;（屬性值沒有順序。）四、背景(Backgrounds)背景的屬性如下：background-color:#f00;背景顏色background-image:url(background.gif);背景圖片background-r

9、epeat:no-repeat;背景圖片是否重復background-attachment:fixed;背景圖片是否固定background-position:。0;背景圖片位置可以縮寫為一句：background:#f00url（background.gif）no-repeatfixed00;語法是：background:colorimagerepeatattachmentposition;你可以省略其中一個或多個屬性值，如果省略，該屬性值將用瀏覽器默認值默認值為：color:transparent,image:none,repeat:repeat,attachment:scroll,pos

10、ition:0%0%五、字體（fonts）字體的屬性如下：font-style:italic;字體風格（斜體，正常體等）font-variant:small-caps;字體的小型大寫字母的字體顯示font-weight:bold;字體的粗名田font-size:1em;字體的大小line-height:140%;字體的行距font-family:"LucidaGrande",sans-serif;字體系列(宋體,楷體等)可以縮寫為一句：font:italicsmall-capsbold1em/140%"LucidaGrande",sans-serif;注

11、意，如果你縮寫字體定義，至少要定義font-size和font-family兩個值。六、列表(lists)list的屬性如下：list-style-type:square;(none代表什么都沒有)list-style-position:inside;list-style-image:url(image.gif);可以縮寫為一句：list-style:squareinsideurl(image.gif);取消默認的圓點和序號可以這樣寫list-style:none;,CSSa意事項：1、如果屬性值是若干單詞，則要給值加上引號；比如：pfont-family:Georgia,"sansserif,Palatino;2、CSS語法里不分大小寫，(日.是元素在調用id和class是區(qū)分大小寫的。比如：#dividcolor:#FFFF00;size:20px;,調用時應寫成id="divid",不能寫id="DIVID"。class也一樣。3、養(yǎng)成寫完每個屬性值后加上“；”號的好習慣。比如：bodycolor:#006666

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論