CSS樣式在網(wǎng)頁html中實(shí)現(xiàn)方法詳解
十多年的桐城網(wǎng)站建設(shè)經(jīng)驗(yàn)，針對設(shè)計、前端、開發(fā)、售后、文案、推廣等六對一服務(wù)，響應(yīng)快，48小時及時工作處理。全網(wǎng)整合營銷推廣的優(yōu)勢是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動調(diào)整桐城建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計，從而大程度地提升瀏覽體驗(yàn)。創(chuàng)新互聯(lián)從事“桐城網(wǎng)站設(shè)計”,“桐城網(wǎng)站推廣”以來，每個客戶項目都認(rèn)真落實(shí)執(zhí)行。
CSS按其位置可以分成三種：
內(nèi)部樣式表(Internal Style Sheet)，把css文檔寫在head/head里面的。只對樣式所在網(wǎng)頁有效。
內(nèi)嵌樣式(Inline Style)，也叫內(nèi)聯(lián)樣式或者叫行內(nèi)樣式，寫在tag標(biāo)簽，如：p id="p1" style="color:red;"/pp id="p2" style="color:blue;"/p，只對當(dāng)前標(biāo)簽起作用，即只對這個段落p（id="p1"）起作用.
外聯(lián)樣式表(External Style Sheet)，將樣式(Styles)寫在一個以.css為后綴的CSS文件里，然后在每個需要用到這些樣式(Styles)的網(wǎng)頁里引用這個CSS文件。引用格式：在head中定義：headlink rel="stylesheet" href="css樣式路徑..1.css" type="text/css" media="screen"/head
rel="stylesheet"表示鏈接元素是一個樣式表（stylesheet）.1.css是單獨(dú)保存在外部的css樣式表文件。其中能包含任何標(biāo)示符，必須以.css為后綴。media是可選屬性，表示用什么媒體輸出，screen是顯示器（默認(rèn)），media="print"表示輸出到打印機(jī)
望采納
1、創(chuàng)建使用css樣式表有三種，分別是外部樣式表，內(nèi)部樣式表和內(nèi)聯(lián)樣式。下面通過一個小demo演示它們的用法。
首先新建一個html文件，放入3個button按鈕，給前兩個按鈕分百別設(shè)置class屬性為btn1和btn2，如下圖。
2.然后準(zhǔn)備一個名為demo的CSS文件。在css文件中寫入buttonA的樣式，并保存css文件:
3,HTML文件,使用鏈接在你的樣式標(biāo)簽標(biāo)簽的引入上一步創(chuàng)建CSS文件,這是外面的使用風(fēng)格,是創(chuàng)建一個好的總結(jié)度在CSS文件編寫風(fēng)格,然后介紹使用鏈接的HTML文件標(biāo)簽,這也是大多數(shù)網(wǎng)站使用方法,因?yàn)樗慕榻B方便,更方便管理:
4.接下來是內(nèi)部樣式表的使用，其中樣式選項卡直接在head選項卡中創(chuàng)建，并添加了btn2樣式。對于內(nèi)部樣式表簡單的HTML文件，內(nèi)部樣式很方便，但是復(fù)雜的HTML文件可能會讓人混淆:
5.最后是使用內(nèi)聯(lián)樣式，直接在第三個標(biāo)簽中使用樣式屬性來添加樣式可以:
6.最后，保存HTML文件，打開瀏覽器并查看所有三個按鈕的樣式。這就是CSS樣式表的制作方法:
寫在頭部的style樣式是叫內(nèi)聯(lián)樣式
head
meta charset="utf-8"
titleCSS_Tab/title
style type="text/css"
.wrap {
width: 500px;
border: 1px solid black;
margin: 0 auto;
}
/style
/head
外聯(lián)樣式是、你在外面寫了一個XXX.css的文件
在html頭部寫上
link rel="stylesheet" href="css的路徑"
嵌入式樣式就是所謂的行內(nèi)樣式，也就是說是在標(biāo)簽內(nèi)寫的。
ul style="height:200px;width:200px;"
外聯(lián)式樣式（屬于外部樣式表）。
特征：
1、有一個單獨(dú)的CSS文件存在！[如：001.css]
2、通過【格式】→【樣式表連接】與CSS文件[001.css]建立連接！
3、在合適的地方使用 class="樣式名" 調(diào)用具體的樣式效果！
如：link href="001.css" type="text/css" rel="Stylesheet"/。
嵌入式樣式（屬于內(nèi)部樣式表）。
特征：
1、樣式的屬性內(nèi)容以代碼的形式[放在 ]寫在網(wǎng)頁代碼中！
2、通過【格式】→【樣式】設(shè)置樣式的屬性內(nèi)容！
3、在合適的地方使用 class="樣式名" 調(diào)用具體的樣式效果！
如： style type="text/css"
.main{ width:1002px; margin:0 auto;}
/style
內(nèi)聯(lián)式樣式（屬于內(nèi)部樣式表）。
特征：
1、樣式的屬性內(nèi)容直接跟在將要修飾的文字標(biāo)記里。
2、具體格式： style="font-size:10px;font-color:#ff0000"。
例如：修飾單元格里的文字。
擴(kuò)展資料：
CSS語言特點(diǎn)：
CSS為HTML標(biāo)記語言提供了一種樣式描述，定義了其中元素的顯示方式。CSS在Web設(shè)計領(lǐng)域是一個突破。利用它可以實(shí)現(xiàn)修改一個小的樣式更新與之相關(guān)的所有頁面元素。
總體來說，CSS具有以下特點(diǎn)：
豐富的樣式定義：
CSS提供了豐富的文檔樣式外觀，以及設(shè)置文本和背景屬性的能力；允許為任何元素創(chuàng)建邊框，以及元素邊框與其他元素間的距離，以及元素邊框與元素內(nèi)容間的距離；允許隨意改變文本的大小寫方式、修飾方式以及其他頁面效果。
易于使用和修改：
CSS可以將樣式定義在HTML元素的style屬性中，也可以將其定義在HTML文檔的header部分，也可以將樣式聲明在一個專門的CSS文件中，以供HTML頁面引用?？傊?，CSS樣式表可以將所有的樣式聲明統(tǒng)一存放，進(jìn)行統(tǒng)一管理。
另外，可以將相同樣式的元素進(jìn)行歸類，使用同一個樣式進(jìn)行定義，也可以將某個樣式應(yīng)用到所有同名的HTML標(biāo)簽中，也可以將一個CSS樣式指定到某個頁面元素中。如果要修改樣式，我們只需要在樣式列表中找到相應(yīng)的樣式聲明進(jìn)行修改。
多頁面應(yīng)用：
CSS樣式表可以單獨(dú)存放在一個CSS文件中，這樣我們就可以在多個頁面中使用同一個CSS樣式表。CSS樣式表理論上不屬于任何頁面文件，在任何頁面文件中都可以將其引用。這樣就可以實(shí)現(xiàn)多個頁面風(fēng)格的統(tǒng)一。
層疊：
簡單的說，層疊就是對一個元素多次設(shè)置同一個樣式，這將使用最后一次設(shè)置的屬性值。例如對一個站點(diǎn)中的多個頁面使用了同一套CSS樣式表，而某些頁面中的某些元素想使用其他樣式。
就可以針對這些樣式單獨(dú)定義一個樣式表應(yīng)用到頁面中。這些后來定義的樣式將對前面的樣式設(shè)置進(jìn)行重寫，在瀏覽器中看到的將是最后面設(shè)置的樣式效果。
頁面壓縮：
在使用HTML定義頁面效果的網(wǎng)站中，往往需要大量或重復(fù)的表格和font元素形成各種規(guī)格的文字樣式，這樣做的后果就是會產(chǎn)生大量的HTML標(biāo)簽，從而使頁面文件的大小增加。
而將樣式的聲明單獨(dú)放到CSS樣式表中，可以大大的減小頁面的體積，這樣在加載頁面時使用的時間也會大大的減少。另外，CSS樣式表的復(fù)用更大程度的縮減了頁面的體積，減少下載的時間。
參考資料來源：百度百科-css
內(nèi)聯(lián)CSS也可稱為行內(nèi)CSS或者行級CSS，它直接在標(biāo)簽內(nèi)部引入，顯著的優(yōu)點(diǎn)是十分的便捷、高效；但是同時也造成了不能夠重用樣式的缺點(diǎn)，如果代碼行數(shù)到達(dá)一定長度不建議采用。通常內(nèi)聯(lián)CSS作為測試使用，可以查找代碼中bug。
body
div style="width: 65px;height: 20px;border: 1px solid;"測試元素/div
/body
重慶分公司
重慶分公司
