第11講 CSS樣式表的應(yīng)用_第1頁(yè)
第11講 CSS樣式表的應(yīng)用_第2頁(yè)
第11講 CSS樣式表的應(yīng)用_第3頁(yè)
第11講 CSS樣式表的應(yīng)用_第4頁(yè)
第11講 CSS樣式表的應(yīng)用_第5頁(yè)
已閱讀5頁(yè)，還剩14頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡(jiǎn)介

CSS樣式表的應(yīng)用1常用表單元素包括哪些？比較文本字段、密碼框和文本區(qū)域的異同？創(chuàng)建文本鏈接（圖像鏈接）的方法？知識(shí)回顧1、選中文本（圖片）2、添加鏈接3、選中目標(biāo)的打開(kāi)方式表單、文本字段、文本區(qū)域、單選按鈕、復(fù)選框、按鈕……都可以用來(lái)輸入文本，文本字段類(lèi)型為單行，密碼框的類(lèi)型為密碼，文本區(qū)域的類(lèi)型為多行。2會(huì)利用CSS樣式來(lái)美化鏈接會(huì)利用CSS樣式美化表格本章目標(biāo)3完成案例：福建五洲集團(tuán)導(dǎo)航條的美化涉及的知識(shí)點(diǎn)空鏈接的創(chuàng)建外部樣式的創(chuàng)建外部樣式的應(yīng)用、修改實(shí)例一：鏈接的美化4什么是CSSCSS：層疊樣式表。是用于控制網(wǎng)頁(yè)樣式并允許將樣式信息與網(wǎng)頁(yè)內(nèi)容分離的一種標(biāo)記性語(yǔ)言。5CSS的新建打開(kāi)CSS樣式面板（shift+F11），點(diǎn)擊“新建CSS規(guī)則”按鈕，6超級(jí)鏈接的4中狀態(tài)筆記超鏈接樣式說(shuō)明a:link未被訪問(wèn)的鏈接樣式，a:visited已被訪問(wèn)過(guò)的鏈接樣式，a:hover鼠標(biāo)懸浮在鏈接上時(shí)的樣式，a:active鼠標(biāo)正在按下時(shí)鏈接文字的樣式，7福建五洲集團(tuán)導(dǎo)航條的美化操作步驟保存，完成案例5創(chuàng)建空鏈接4設(shè)置樣式3外部樣式的鏈接打開(kāi)CSS樣式面板

1創(chuàng)建超鏈接樣式

28完成案例：淘寶首頁(yè)寶貝欄目鏈接美化涉及的知識(shí)點(diǎn)空鏈接的創(chuàng)建外部樣式的創(chuàng)建外部樣式的應(yīng)用、修改實(shí)例二：鏈接的美化（學(xué)生練習(xí)）9CSS的類(lèi)型行內(nèi)樣式CSS的類(lèi)型內(nèi)部樣式表外部樣式表嵌入樣式內(nèi)部樣式表:內(nèi)部樣式表只對(duì)所在的網(wǎng)頁(yè)有效。外部樣式表:是在頁(yè)面中引用一個(gè).CSS文件。10小結(jié)1、什么是CSS樣式表？2、創(chuàng)建CSS樣式表的方法？3、CSS的類(lèi)型？4、超級(jí)鏈接的美化？層疊樣式表。是用于控制網(wǎng)頁(yè)樣式并允許將樣式信息與網(wǎng)頁(yè)內(nèi)容分離的一種標(biāo)記性語(yǔ)言。CSS面板——新建CSS規(guī)則內(nèi)部樣式表:內(nèi)部樣式表只對(duì)所在的網(wǎng)頁(yè)有效。外部樣式表:是在頁(yè)面中引用一個(gè).CSS文件。11需求描述注冊(cè)頁(yè)的美化涉及的知識(shí)點(diǎn)創(chuàng)建樣式鏈接樣式設(shè)置單元格屬性樣式設(shè)置表單屬性樣式完成效果實(shí)例三：注冊(cè)頁(yè)的美化12講解邊框“分類(lèi)”屬性介紹樣式寬度顏色

操作步驟創(chuàng)建表格樣式

2美化字體

1應(yīng)用表格樣式

3表格的美化13定義樣式規(guī)則

5新建樣式4應(yīng)用樣式

6講解“背景”分類(lèi)屬性介紹背景顏色背景圖像重復(fù)附件水平位置／垂直位置操作步驟

保存，完成案例3

7表單的美化14優(yōu)點(diǎn)通過(guò)使用外部樣式，使網(wǎng)站改版更加方便，而且縮短改版時(shí)間。減少頁(yè)面代碼，提高頁(yè)面反應(yīng)速度。表現(xiàn)和內(nèi)容相分離，方便設(shè)計(jì)師與程序員分工協(xié)作。強(qiáng)大的字體控制和排版能力。缺點(diǎn)CSS樣式應(yīng)用過(guò)多會(huì)使工作量增大，給網(wǎng)站維護(hù)造成麻煩。CSS的優(yōu)缺點(diǎn)網(wǎng)頁(yè)設(shè)計(jì)15行內(nèi)樣式行內(nèi)樣式是所有樣式方法中最為直接的一種，直接對(duì)html的標(biāo)記使用style屬性，然后將CSS代碼直接寫(xiě)在其中。內(nèi)嵌式內(nèi)嵌樣式就是將CSS寫(xiě)在<head>與</head>之間，并且用<style>與</style>標(biāo)記進(jìn)行聲明。使用CSS控制頁(yè)面

網(wǎng)頁(yè)設(shè)計(jì)16鏈接式鏈接樣式是使用頻率最高、最為實(shí)用的方法，將HTML頁(yè)面本身與CSS樣式風(fēng)格分離為兩個(gè)或者多個(gè)文件，實(shí)現(xiàn)了頁(yè)面框架HTML代碼與美工CSS代碼的完全分離，體現(xiàn)了分工協(xié)作。導(dǎo)入樣式與鏈接樣式基本相同，采用import方式導(dǎo)入的樣式表，在HTML文件初始化時(shí)，會(huì)被導(dǎo)入到HTML文件內(nèi)，作為文件一部分，類(lèi)似內(nèi)嵌樣式的效果。使用CSS控制頁(yè)面

網(wǎng)頁(yè)設(shè)計(jì)17列舉CSS樣式的優(yōu)點(diǎn)。

CSS

溫馨提示

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

最新文檔

評(píng)論

0/150

提交評(píng)論