国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

15158846557 或 在線咨詢 在線咨詢
15158846557 或 在線咨詢
所在位置： 首頁(yè) > 營(yíng)銷資訊 > 網(wǎng)站運(yùn)營(yíng) > 輕松學(xué)：網(wǎng)頁(yè)設(shè)計(jì)8-網(wǎng)頁(yè)美化CSS基礎(chǔ)

輕松學(xué)：網(wǎng)頁(yè)設(shè)計(jì)8-網(wǎng)頁(yè)美化CSS基礎(chǔ)

時(shí)間：2023-09-28 06:18:02 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-09-28 06:18:02 來(lái)源：網(wǎng)站運(yùn)營(yíng)

輕松學(xué)：網(wǎng)頁(yè)設(shè)計(jì)8-網(wǎng)頁(yè)美化CSS基礎(chǔ)：使用HTML修飾頁(yè)面時(shí)，存在很大的局限和不足，例如維護(hù)困難、不利于代碼的閱讀等。開(kāi)發(fā)者往往需要更多的字體選擇、更方便的樣式效果、更絢麗的圖形動(dòng)畫。CSS3的出現(xiàn)極大地滿足了開(kāi)發(fā)者的需求。

CSS英文全稱為“Cascading Style Sheet”，中文譯為“層疊樣式表”。CSS以HTML為基礎(chǔ)，提供了豐富的功能，如字體、顏色、背景的控制及整體排版等，而且還可以針對(duì)不同的瀏覽器設(shè)置不同的樣式。

包括盒子模型、列表模塊、超鏈接方式、語(yǔ)言模塊、背景和邊框、文字特效、多欄布局等模塊。

CSS樣式的書寫規(guī)則:

選擇器{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3;} 在樣式規(guī)則中，選擇器用于指定CSS樣式作用的HTML對(duì)象，花括號(hào)內(nèi)是對(duì)該對(duì)象設(shè)置的具體樣式。其中，屬性和屬性值以“鍵值對(duì)”的形式出現(xiàn)，用英文“:”連接，多個(gè)“鍵值對(duì)”之間用英文“;”進(jìn)行區(qū)分。

引入CSS樣式表:

1.行內(nèi)式也稱為內(nèi)聯(lián)樣式，是通過(guò)標(biāo)記的style屬性來(lái)設(shè)置元素的樣式。

基本語(yǔ)法格式"<標(biāo)記名 style="屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3;"> 內(nèi)容 </標(biāo)記名>

<h2 style="font-size:20px; color:red;"> 使用CSS行內(nèi)式修飾二級(jí)標(biāo)題的字體大小和顏色</h2>2.內(nèi)嵌式是將CSS代碼集中寫在HTML文檔的<head>頭部標(biāo)記中，并且用<style>標(biāo)記定義

基本語(yǔ)法格式<head> <style type="text/css">

選擇器 {屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3;}

</style></head>

<head><meta charset="utf-8"><title>內(nèi)嵌式引入CSS樣式表</title><style type="text/css">h2{text-align:center;} /*定義標(biāo)題標(biāo)記居中對(duì)齊*/p{ /*定義段落標(biāo)記的樣式*/ font-size:16px; color:red; text-decoration:underline;} </style></head>3.鏈入式是將所有的樣式放在一個(gè)或多個(gè)以.css為擴(kuò)展名的外部樣式表文件中，通過(guò)<link />標(biāo)記將外部樣式表文件鏈接到HTML文檔中

基本語(yǔ)法格式:<link href="CSS文件的路徑" type="text/css" rel="stylesheet" />

鏈入式應(yīng)用

1．首先創(chuàng)建一個(gè)HTML文檔demo.html，并在該文檔中添加一個(gè)標(biāo)題和一個(gè)段落文本。

2．新建CSS樣式文件style.css,并打開(kāi)，在CSS文檔編輯窗口中輸入以下代碼，并保存CSS樣式表文件。

在HTML文檔的<head>頭部標(biāo)記中，添加<link />語(yǔ)句，將style.css外部樣式表文件鏈接到demo01.html文檔中

<link href="style.css" type="text/css" rel="stylesheet" />要想將CSS樣式應(yīng)用于特定的HTML標(biāo)簽，首先需要找到該目標(biāo)標(biāo)簽。CSS3是CSS的最新版本，在CSS3中增加了許多新的選擇器。運(yùn)用這些選擇器可以簡(jiǎn)化網(wǎng)頁(yè)代碼的書寫，讓穩(wěn)當(dāng)?shù)慕Y(jié)構(gòu)更加簡(jiǎn)單。

1.元素選擇器也稱為標(biāo)記選擇器，是指用HTML標(biāo)記名稱作為選擇器

基本語(yǔ)法格式:標(biāo)記名{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3; }

2.類選擇器使用“.”（英文點(diǎn)號(hào)）進(jìn)行標(biāo)識(shí)，后面緊跟類名

基本語(yǔ)法格式: .類名{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3; }

3.id選擇器使用“#”進(jìn)行標(biāo)識(shí)，后面緊跟id名

基本語(yǔ)法格式:#id名{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3; }

4.通配符選擇器用“*”號(hào)表示，是所有選擇器中作用范圍最廣的，能匹配頁(yè)面中所有的元素

基本語(yǔ)法格式;*{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3; }

5.分組選擇器也叫并集選擇器，是各個(gè)選擇器通過(guò)逗號(hào)連接而成的。

任何形式的選擇器（包括標(biāo)記選擇器、class類選擇器id選擇器等），都可以作為分組選擇器的一部分。如果某些選擇器定義的樣式完全相同，或部分相同，就可以利用分組選擇器為它們定義相同的CSS樣式。使用分組選擇器定義樣式與對(duì)各個(gè)基礎(chǔ)選擇器單獨(dú)定義樣式效果完全相同，而且這種方式書寫的CSS代碼更簡(jiǎn)潔、直觀。

關(guān)鍵詞：基礎(chǔ),美化,設(shè)計(jì)

74
73
25
news

版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。

為了最佳展示效果，本站不支持IE9及以下版本的瀏覽器，建議您使用谷歌Chrome瀏覽器。 點(diǎn)擊下載Chrome瀏覽器
關(guān)閉