淺談CSS樣式在網(wǎng)頁(yè)文字上的應(yīng)用

馬春艷

摘要：隨著互聯(lián)網(wǎng)的發(fā)展，網(wǎng)頁(yè)前端開(kāi)發(fā)作為一個(gè)炙手可熱的就業(yè)方向越來(lái)越被人重視，其中一個(gè)重要的知識(shí)點(diǎn)就是CSS樣式在網(wǎng)頁(yè)中的運(yùn)用。本文主要介紹網(wǎng)頁(yè)設(shè)計(jì)中CSS樣式在文字上的應(yīng)用。

關(guān)鍵詞：網(wǎng)頁(yè)前端開(kāi)發(fā)；CSS樣式

中圖分類(lèi)號(hào)：G642 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2019）08-0263-02

在當(dāng)今的網(wǎng)頁(yè)中，幾乎很多網(wǎng)頁(yè)都使用了CSS樣式，有了CSS的控制，網(wǎng)頁(yè)便會(huì)給人一種賞心悅目的感覺(jué)，字體的色彩變化也使網(wǎng)頁(yè)變得更加生動(dòng)活潑。

1 CSS樣式概述

CSS英文全稱Cascading Style Sheets，中文全稱為層疊樣式表，更多的人把它稱之為樣式表，以下簡(jiǎn)稱為CSS樣式。

網(wǎng)頁(yè)HTML中大量使用DIV、SPAN、TABLE表格等標(biāo)簽布局，要實(shí)現(xiàn)漂亮的布局，包括寬度、高度、背景、字體大小等，我們就需要CSS樣式統(tǒng)一實(shí)現(xiàn)。同樣的一組DIV標(biāo)簽，對(duì)應(yīng)CSS樣式代碼不同，所得到效果也不同。我們可以比作HTML是骨架，CSS是衣服。相同HTML骨架結(jié)構(gòu)，不同CSS樣式，所得到的美化布局效果不同。

簡(jiǎn)單來(lái)說(shuō)，CSS樣式用于控制Web頁(yè)面內(nèi)容的外觀，通過(guò)使用CSS樣式設(shè)置頁(yè)面的格式，可將頁(yè)面的內(nèi)容與表示形式分離開(kāi)。在日常開(kāi)發(fā)網(wǎng)頁(yè)的時(shí)候，我們通常是HTML與CSS代碼同時(shí)進(jìn)行，這樣易于開(kāi)發(fā)不容易出錯(cuò)。

2 CSS樣式在網(wǎng)頁(yè)文字上的應(yīng)用

通過(guò)三種方式介紹CSS在網(wǎng)頁(yè)中文字的應(yīng)用。顯示的效果是“網(wǎng)頁(yè)設(shè)計(jì)與制作”這幾個(gè)字以宋體、字號(hào)大小為20pt，傾斜的方式顯示。

（1） 內(nèi)聯(lián)式樣式表

HTML標(biāo)簽直接使用style屬性，稱為內(nèi)聯(lián)樣式（Inline Style Sheet）。它適用于只需要簡(jiǎn)單地將一些樣式應(yīng)用于某個(gè)獨(dú)立的元素的情況。

示例代碼如下：