CSS發(fā)展史整理

CSS發(fā)展史 CSS（Cascading Style Sheets，層疊樣式表）是一種將表示樣式應用到標記的系統(tǒng)。CSS以設(shè)計、改變其HTML頁面的樣式而知名，并使用于Web和其他媒介，如XML文檔中。1996年12月W3C推出了CSS規(guī)范的第一個版本，1998年W3C發(fā)布了CSS的第二個版本即CSS2.0,2001年5月W3C開始進行CSS3標準的制定，到目前為止該標準還沒有最終定稿。 CSS1.0 選擇器：要使用CSS對HTML頁面中的元素實現(xiàn)一對一，一對多或者多對一的控制，就需要用到CSS選擇器。選擇器大致分為派生選擇器、ID選擇器和類選擇器，用來定義希望應用樣式的HTML元素或者標簽。 樣式屬性：該屬性主要包括Font字體、Text文本、Background背景、Position定位、Dimensions尺寸、Layout布局、Margin外邊框、Border邊框、Padding內(nèi)邊框、List列表、Table表格和Scrollbar滾動條等，用于定義網(wǎng)頁的一些樣式變化。 偽類屬性：主要定義了針對描述對象a的link、hover、active、visited和針對節(jié)點的first-letter、first-child、first-line等幾個偽類屬性。 保存方式：用戶可以直接存儲在HTML網(wǎng)頁中，也可以將CSS樣式代碼存儲為獨立的樣式表文件。 CSS2.0 選擇器：css2提供了更多強大的選擇器，用來定位HTML節(jié)點或者標記 符號名稱 含義 示例 * 用于匹配任何標記 *{color：red} > 用于指定父子節(jié)點關(guān)系 AAA > CCC > DDD > {color:red}匹配父節(jié)點分別為CCC和AAA的節(jié)點DDD節(jié)點 □ 用于匹配在某一層有某個父節(jié)點的節(jié)點 AAA CCC DDD {color:blue}匹配包含父節(jié)點CCC的父節(jié)點AAA的節(jié)點DDD + 用于表示在同一個級別節(jié)點之間的關(guān)系 AAA+BBB{color:red}表示，有一個兄弟節(jié)點AAA的節(jié)點BBB 名稱[表達式] 選擇包含特殊屬性值的節(jié)點 BBB[text="xyz"]{color:blue} 表示包含text屬性值為xyz的BBB標簽 位置模型：在CSS2中進一步增強了位置屬性功能，增加了relative、absolute和fixed等幾個值 值名稱 含義 relative 元素框相對父節(jié)點偏移某個距離，元素仍保持其未定位前的形狀，它原本所占的空間仍保留 absolute 元素框從文檔流中完全刪除，并相對于其包含塊定位。包含塊可能是文檔中的另一個元素或者是初始包含塊。元素原先在正常文檔流中所占的空間會關(guān)閉，就好像元素原來不存在一樣 fixed 元素框的表現(xiàn)類似于absolute值，不過其包含塊是視窗本身 z-index 用來指定相互重疊的元素的疊放順序，數(shù)字較大的元素會疊放在數(shù)值較小的元素前面 布局、表格樣式：CSS2對display屬性進行了擴充，用戶可用該屬性指定元素是否會顯示以及如何顯示，也可以使用該屬性配合位置和浮動進行頁面的布局。另外，用戶還可以將一個非表格的結(jié)構(gòu)化文檔顯示為一個表格樣式。 媒體類型：用于對不同的媒體類型定義不同的樣式。 屬性名稱 含義 aural 用于語音和音頻合成器 embossed 用于分頁的盲人用點字法打印 print 用于打印機 screen 用于計算機顯示器 braille 用于盲人用點字法觸覺回饋設(shè)備 projection 用于方案展示如幻燈片 偽類：CSS2增加了focus（將樣式添加到被選中的元素）、：first-child（將特殊的樣式添加到元素的第一個子元素）、：lang（允許創(chuàng)作者來定義指定的元素中使用的語言）。 光標樣式：增加了cursor屬性，用于指定設(shè)備應該顯示怎樣的光標類型。 值名稱 含義 default 默認光標（通常是一個箭頭） auto 默認，瀏覽器設(shè)置的光標 crosshair 光標呈現(xiàn)為十字線 pointer 光標呈現(xiàn)為指示鏈接的指針（一只手） move 此光標指示某對象可被移動 e-resize 此光標指示矩形框的邊緣可被向右移動 text 此光標指示文本 wait 此光標指示程序正忙（通常是一只表或沙漏形狀） help 此光標指示可用的幫助（通常是一個問號或一個氣球） DIV+CSS其實是一種錯誤的叫法，標準的叫法應該是XHTML+CSS，因為DIV與table都是XHTML或HTML語言中的一個標記，而CSS只是一種樣式表現(xiàn)。DIV+CSS已經(jīng)將內(nèi)容和表現(xiàn)分割開來，所以修改網(wǎng)頁時只需指定內(nèi)容修改即可。 CSS常用命令規(guī)則 名稱 含義 名稱 含義 header 頁頭 content/Container 內(nèi)容 footer 頁腳 nav 導航 sidebar 側(cè)欄 column 欄目 wrapper 頁面外圍控制整體布局寬度 left 左側(cè) right 右側(cè) center 中間 loginbar 登錄條 logo 標志 banner 廣告 main 頁面主題 hot 熱點 news 新聞 download 下載 subnav 子導航 menu 菜單 submenu 子菜單 search 搜索 friendlink 友情鏈接 copyright 版權(quán) scroll 滾動 content 內(nèi)容 tab 標簽頁 list 文章列表 msg 提示信息 title 欄目標題 joinus 加入 guild 指南 service 服務 register 注冊 status 狀態(tài) vote 投票 partner 合作伙伴

CSS3