CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用

CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用

ID:39550288

大?。?0.00 KB

頁(yè)數(shù):3頁(yè)

時(shí)間:2019-07-06

CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用_第1頁(yè)
CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用_第2頁(yè)
CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用_第3頁(yè)
資源描述:

《CSS樣式表在網(wǎng)頁(yè)制作中的應(yīng)用》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)。

1、ChinaComputer&Communication隨著Internet的不斷普及和飛速發(fā)展,網(wǎng)絡(luò)已經(jīng)成為人們獲取、發(fā)布和傳遞信息的主要渠道之一,在人們的工作、生活、學(xué)習(xí)和娛樂(lè)中起著非常重要的作用。上網(wǎng)已經(jīng)漸漸成為人們的一種習(xí)慣,網(wǎng)絡(luò)上的信息主要是通過(guò)網(wǎng)站來(lái)發(fā)布實(shí)現(xiàn)的,而網(wǎng)站又是由不同的網(wǎng)頁(yè)構(gòu)成的。在制作網(wǎng)頁(yè)的過(guò)程中,既需要設(shè)計(jì)合理的字體和布局,還需要考慮兼容不同瀏覽器。為了方便解決這些難題,在網(wǎng)頁(yè)的構(gòu)建過(guò)程中引入CSS樣式表,是一個(gè)不錯(cuò)的選擇。一、CSS樣式表概述CSS是CascadingStyl

2、eSheet的縮寫(xiě),譯作“層疊樣式表單”。它是一種在網(wǎng)頁(yè)制作過(guò)程中經(jīng)常用到的技術(shù)。CSS樣式表其實(shí)是一組樣式,它增加了更多的樣式定義方法來(lái)輔助HTML。樣式就是用一個(gè)指定的名字來(lái)標(biāo)識(shí)和保存的一組有關(guān)字符和段落格式的選項(xiàng)集合。其實(shí),我們很早就已經(jīng)與“樣式”打過(guò)交道了。在Word的“格式”菜單中的“樣式項(xiàng)”里,提供了多種樣式,如“標(biāo)題1”、“標(biāo)題2”、“正文”等。只要選定文字,然后選擇不同的樣式,所選定的文字就會(huì)自動(dòng)改變字體、字號(hào)、對(duì)齊方式、字間距等。同樣,我們可以通過(guò)CSS來(lái)規(guī)定網(wǎng)頁(yè)元素的各種樣式,如顏

3、色、位置、大小等。二、CSS樣式表的優(yōu)勢(shì)CSS樣式表是用于(增強(qiáng))控制網(wǎng)頁(yè)樣式并允許將樣式信息與網(wǎng)頁(yè)內(nèi)容分離的一種標(biāo)記性語(yǔ)言。通過(guò)使用CSS樣式表,不僅可以對(duì)文字格式進(jìn)行設(shè)置,還可以更加精確地控制布局、字體、顏色、背景和其他圖文效果,從而避免在標(biāo)識(shí)字符和設(shè)置段落格式等操作時(shí)重復(fù)定義需要的樣式,提高網(wǎng)頁(yè)編輯的效率。CSS是對(duì)以前的HTML(HTML3.2以前的版本)語(yǔ)法的一次重大革新,是DHTML(動(dòng)態(tài)網(wǎng)頁(yè))的一部分。建立CSS的意義在于把對(duì)象真正引入到HTML中,使其可以使用腳本程序(如JavaScr

4、ipt、VBscript)調(diào)用和改變對(duì)象屬性,從而使網(wǎng)頁(yè)中的對(duì)象產(chǎn)生動(dòng)態(tài)的效果,這在以前的HTML中是無(wú)法實(shí)現(xiàn)的。CSS甚至超越了WEB頁(yè)面本身的顯示功能,把樣式擴(kuò)展到多種媒體上,顯示了難以抗拒的魅力。三、CSS樣式表在HTML中的實(shí)現(xiàn)在HTML網(wǎng)頁(yè)中加入CSS并不是只有一種方法,在不同的情況下,可以采用不同的方法,比較常用的有下面幾中。1.嵌入式樣式表嵌入式樣式表的實(shí)現(xiàn)很簡(jiǎn)單,只需在每個(gè)要應(yīng)用樣式的HTML標(biāo)簽后寫(xiě)上CSS屬性即可。例如要設(shè)置指定表格中的文字的樣式為紅色,字號(hào)為10pt,可在當(dāng)前表格

5、的

標(biāo)記內(nèi)添加下面的代碼:。這種方式主要用于對(duì)具體的標(biāo)簽作具體的調(diào)整,其作用的范圍只限于本標(biāo)簽。嵌入式樣式表不能充分體現(xiàn)出CSS樣式表的優(yōu)越性,所以應(yīng)用場(chǎng)合并不多。2.內(nèi)聯(lián)式樣式表若想只對(duì)當(dāng)前頁(yè)面應(yīng)用樣式,就要使用內(nèi)聯(lián)式樣式表。所謂內(nèi)聯(lián)式樣式表就是把樣式表定義語(yǔ)句放在標(biāo)簽和中,設(shè)置時(shí)通常放在HTML代碼的部分。3.外聯(lián)式樣式表外聯(lián)式樣式表是將

6、指定的樣式代碼放到一個(gè)擴(kuò)展名為.css的樣式文件中以方便其他網(wǎng)頁(yè)的調(diào)用。這種方式的優(yōu)點(diǎn)是可以通過(guò)一個(gè).css文件管理網(wǎng)站中的多個(gè)網(wǎng)頁(yè)。如果要對(duì)網(wǎng)站中其他頁(yè)面進(jìn)行樣式引用,可以先把樣式用記事本定義成一個(gè)“.css”的文件。例如:打開(kāi)記事本,將定義的名為h3的樣式代碼寫(xiě)到記事本中,保存的文件名為example.css,代碼如下:h3{font-family:”黑體”;color:green;font-style:italic;}引用時(shí)在網(wǎng)頁(yè)HTML代碼的標(biāo)記后用

7、heet”href=”example.css”>引用這個(gè)樣式文件,在部分的相應(yīng)內(nèi)容的前后加上

。四、CSS應(yīng)用時(shí)應(yīng)遵循的原則1.使用CSS時(shí)標(biāo)記不宜過(guò)多在網(wǎng)站的開(kāi)發(fā)過(guò)程中,有嚴(yán)密的CSS文檔,一般不會(huì)經(jīng)常去更新。當(dāng)網(wǎng)站需要修改或更新時(shí),如果有大量的CSS存在,將會(huì)對(duì)修改或更新工作形成一定的阻礙,不便于修改的順利進(jìn)行,導(dǎo)致制作者無(wú)法對(duì)網(wǎng)站樣式表結(jié)構(gòu)有整體的把握。創(chuàng)建簡(jiǎn)潔的樣式,將會(huì)對(duì)網(wǎng)站的運(yùn)行、更新提供便利。2.語(yǔ)義定義要明確、易懂在選擇恰當(dāng)?shù)摹⒂幸饬x的元素來(lái)表述的同時(shí),還

8、要確定選擇class和id屬性值。定義明確可以讓網(wǎng)站的維護(hù)變得簡(jiǎn)單,方便制作者的理解。3.添加適當(dāng)?shù)淖⑨尯蜆?biāo)簽添加適當(dāng)?shù)淖⑨尰驑?biāo)簽,可以為自己或其他開(kāi)發(fā)人員留下提示信息以避免后期引起的不必要的困惑和麻煩。最常見(jiàn)的是為CSS樣式規(guī)則添加提示信息,不過(guò)使用注釋對(duì)優(yōu)化組織結(jié)構(gòu)和提升效用也很有幫助。這種應(yīng)用簡(jiǎn)潔性最為重要。4.在網(wǎng)頁(yè)中盡量使用CSS外聯(lián)樣式在前面已經(jīng)提到過(guò)外聯(lián)式的使用方法,這種方法的優(yōu)勢(shì)就是可以在不同的網(wǎng)頁(yè)中調(diào)用,實(shí)現(xiàn)重復(fù)的使用。一個(gè)外部CSS文

當(dāng)前文檔最多預(yù)覽五頁(yè),下載文檔查看全文

此文檔下載收益歸作者所有

當(dāng)前文檔最多預(yù)覽五頁(yè),下載文檔查看全文
溫馨提示:
1. 部分包含數(shù)學(xué)公式或PPT動(dòng)畫(huà)的文件,查看預(yù)覽時(shí)可能會(huì)顯示錯(cuò)亂或異常,文件下載后無(wú)此問(wèn)題,請(qǐng)放心下載。
2. 本文檔由用戶上傳,版權(quán)歸屬用戶,天天文庫(kù)負(fù)責(zé)整理代發(fā)布。如果您對(duì)本文檔版權(quán)有爭(zhēng)議請(qǐng)及時(shí)聯(lián)系客服。
3. 下載前請(qǐng)仔細(xì)閱讀文檔內(nèi)容,確認(rèn)文檔內(nèi)容符合您的需求后進(jìn)行下載,若出現(xiàn)內(nèi)容與標(biāo)題不符可向本站投訴處理。
4. 下載文檔時(shí)可能由于網(wǎng)絡(luò)波動(dòng)等原因無(wú)法下載或下載錯(cuò)誤,付費(fèi)完成后未能成功下載的用戶請(qǐng)聯(lián)系客服處理。