網(wǎng)頁設(shè)計(jì)與制作教程-Web前端開發(fā)(第6版)課件第4章-CSS3基礎(chǔ)4.3_第1頁
網(wǎng)頁設(shè)計(jì)與制作教程-Web前端開發(fā)(第6版)課件第4章-CSS3基礎(chǔ)4.3_第2頁
網(wǎng)頁設(shè)計(jì)與制作教程-Web前端開發(fā)(第6版)課件第4章-CSS3基礎(chǔ)4.3_第3頁
網(wǎng)頁設(shè)計(jì)與制作教程-Web前端開發(fā)(第6版)課件第4章-CSS3基礎(chǔ)4.3_第4頁
網(wǎng)頁設(shè)計(jì)與制作教程-Web前端開發(fā)(第6版)課件第4章-CSS3基礎(chǔ)4.3_第5頁
已閱讀5頁,還剩3頁未讀 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

本節(jié)介紹CSS的兩個(gè)主要特性。第4章CSS3基礎(chǔ)4.3CSS的兩個(gè)主要特性《網(wǎng)頁設(shè)計(jì)與制作教程Web前端開發(fā)第6版》劉瑞新主編配套資源目錄第4章CSS3基礎(chǔ)4.1CSS簡介4.2在HTML中使用CSS的方法4.3CSS的兩個(gè)主要特性4.4CSS的基本語法4.5CSS的選擇器4.6屬性值的寫法和單位4.7HTML文檔結(jié)構(gòu)與元素類型4.8實(shí)訓(xùn)——制作內(nèi)容詳情頁習(xí)題41.層疊CSS的第一個(gè)特性是“層疊”,層疊(cascade)是指CSS能夠?qū)ν粋€(gè)元素應(yīng)用多個(gè)樣式表的能力?!纠?-5】樣式表的層疊示例。在div標(biāo)簽中嵌套p標(biāo)簽,本例文件4-5.html在瀏覽器中顯示的效果,如圖4-7所示。4.3CSS的兩個(gè)主要特性<!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title>多重樣式表的層疊</title> <styletype="text/css"> div{color:red;font-size:12pt;} p{color:blue;} </style> </head> <body> <div> <!--p元素里的內(nèi)容會繼承div定義的屬性--> <p>這個(gè)段落的文字為藍(lán)色12號字</p> </div> </body></html>4.3CSS的兩個(gè)主要特性2.繼承CSS的第二個(gè)特性是“繼承”,繼承指的是特定的CSS屬性可以從父元素向下傳遞到子元素?!纠?-6】CSS繼承示例,本例文件4-6.html在瀏覽器中顯示的效果如圖4-8所示。4.3CSS的兩個(gè)主要特性4.3CSS的兩個(gè)主要特性<!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title>繼承示例</title> <styletype="text/css"> p{color:#00f;/*定義文字顏色為藍(lán)色*/ text-decoration:underline;/*增加下劃線*/} pem{/*為p元素中的em子元素定義樣式*/ font-size:24px;/*定義文字大小為24px*/ color:#f00;/*定義文字顏色為紅色*/} </style> </head>4.3CSS的兩個(gè)主要特性 <body> <h3>CSS基礎(chǔ)</h3> <p>CSS是一組格式設(shè)置規(guī)則,用于控制<em>Web</em>網(wǎng)頁的外觀。</p> <ul> <li>CSS的優(yōu)點(diǎn)

<ul> <li>表現(xiàn)和內(nèi)容(結(jié)構(gòu))分離</li> <li>易于維護(hù)和<em>改版</em></li> <li>更好的控制頁面布局</li> </ul> </li> <li>CSS設(shè)計(jì)與編寫原則</li> </ul

溫馨提示

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

評論

0/150

提交評論