1.使用HTML標簽的STYLE屬性
在察隅等地區(qū),都構(gòu)建了全面的區(qū)域性戰(zhàn)略布局,加強發(fā)展的系統(tǒng)性、市場前瞻性、產(chǎn)品創(chuàng)新能力,以專注、極致的服務(wù)理念,為客戶提供成都網(wǎng)站設(shè)計、做網(wǎng)站 網(wǎng)站設(shè)計制作按需網(wǎng)站制作,公司網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),高端網(wǎng)站設(shè)計,營銷型網(wǎng)站建設(shè),成都外貿(mào)網(wǎng)站建設(shè),察隅網(wǎng)站建設(shè)費用合理。
將STYLE屬性直接加在單個的HTML元素標簽上,控制HTML標簽的表現(xiàn)樣式。這種引入CSS的方式是分散靈活方便,但缺乏整體性和規(guī)劃性,不利于后期的修改和維護,當需要修改網(wǎng)站的樣式時,一個相同的修改可能涉及多個地方,維護成本高。使用STYLE屬性的樣式效果最強,會覆蓋掉其它幾種引入方式的相同樣式效果。
2.將樣式代碼寫在頁面STYLE.../STYLE標簽之中
STYLE.../STYLE結(jié)構(gòu)可以位于頁面HTML標簽中的任何位置,也可以多次出現(xiàn)。通常是將整個STYLE.../STYLE結(jié)構(gòu)寫在頁面的HEAD.../HEAD部分中。這種引入CSS方式的特點是每個頁面的CSS代碼可能具有統(tǒng)一性和規(guī)劃性,一個頁面內(nèi)部便于復用和維護,但多個頁面之間的CSS代碼復用仍然不夠。
3.使用 LINK標簽,引入外部CSS文件
將css代碼寫在一個單獨的文件中,用link標簽直接引入該文件到頁面中。一個頁面可以多次使用LINK標簽引入多個外部css文件,注意這些CSS代碼的相互影響,通常是后引入的CSS文件會覆蓋前面引入的CSS文件的相同效果。這種引入CSS的方式是目前最為流行的,可以在站個網(wǎng)站范圍內(nèi)進行CSS代碼的規(guī)劃,方便復用和維護,但這樣將代碼高度集中,代碼量可能過大,維護不當?shù)脑捰秩菀壮霈F(xiàn)混亂。
4.使用@import引入CSS文件
使用@import引入CSS文件有兩種方式,一種可以放在頁面中的STYLE.../STYLE 中,用法如下:
@import url(index2.css);
另外也可以放在CSS文件中使用,用法如下:
@import "sub.css";
使用用@import引入CSS可以很方便的引入外部文件的CSS代碼,方便維護和規(guī)劃。但是每多引入一個CSS文件,就會對服務(wù)器增加一次連接請求,當訪問量較大時,需在維護性和性能上進行權(quán)衡。
按優(yōu)先級:前端優(yōu)先讀取正序。正規(guī)規(guī)范優(yōu)先倒序。
style= 這樣肯定是最優(yōu)的,但也是最不推薦的。前端標簽直接寫入。
延伸閱讀:讀取優(yōu)先,靈活使用,如大量頁面,每頁面都要設(shè)置。工作繁瑣,大量寫入增加代碼量。不利優(yōu)化。
style type="text/css" 這樣屬于第二讀取方式。直接寫在對應(yīng)的頁面。
延伸閱讀:每頁面都要設(shè)置。工作繁瑣,大量寫入增加代碼量。不利優(yōu)化。
link type="text/css" href=" 引用CSS文件 第三級。這全局引入.
延伸閱讀:全局CSS??梢苑蛛x代碼及外部引入,簡單快捷。也是現(xiàn)在都在用的。
主要有3種,外部、內(nèi)部、內(nèi)嵌
外部樣式,行為和表現(xiàn)分離。代碼清晰方便后期維護。
內(nèi)部樣式,直接在head標簽里面 寫 style
內(nèi)嵌,直接在標簽里面寫樣式
CSS樣式分為:內(nèi)聯(lián)式css樣式、嵌入式css樣式、外部式css樣式。
對CSS三種樣式定義及其實例:
內(nèi)聯(lián)式css樣式。
內(nèi)聯(lián)式css樣式表就是把css代碼直接寫在現(xiàn)有的HTML標簽中,如下面代碼:
p?style="color:red"這里文字是紅色。/p
css樣式代碼要寫在style=""雙引號中,如果有多條css樣式代碼設(shè)置可以寫在一起,中間用分號隔開(英文狀態(tài)下;)。
嵌入式css樣式。
嵌入式css樣式,就是可以把css樣式代碼寫在標簽之間。如下面代碼實現(xiàn)把三個標簽中的文字設(shè)置為紅色:
style?type="text/css"span{color:red;}/style
嵌入式css樣式必須寫在之間,并且一般情況下嵌入式css樣式寫在之間。
外部式css樣式。
外部式css樣式(也可稱為外聯(lián)式)就是把css代碼寫一個單獨的外部文件中,這個css樣式文件以“.css”為擴展名(也可以為調(diào)用其他網(wǎng)站CSS)。
link?href="style.css"?rel="stylesheet"?type="text/css"?/
注意事項:?
1、css樣式文件名稱以有意義的英文字母命名,如 main.css。?
2、rel=”stylesheet” type=”text/css” 是固定寫法不可修改。?
3、標簽位置一般寫在標簽之內(nèi)。
掌握好三種CSS三種樣式使用方法在Web開發(fā)中將節(jié)省很多時間。
CSS樣式表定義的基本語法:
Select { property1 : value, property2: value2 }
CSS樣式表一共分3種,分別是:
1、內(nèi)聯(lián)樣式表:
內(nèi)聯(lián)樣式表是寫在標記內(nèi)的,只對所在標記有效。
2、內(nèi)部及聯(lián)樣式表:
利用style標記將樣式表嵌在HTML文件的頭部。
3、外部級聯(lián)樣式表:
使用link標記可以將樣式表鏈接到網(wǎng)頁上。
CSS樣式表的優(yōu)先級:(由低到高)
瀏覽器默認(優(yōu)先級最低)
外部級聯(lián)樣式表
內(nèi)部及聯(lián)樣式表
內(nèi)聯(lián)樣式表(優(yōu)先級最高)
樣式的引用形式大致可分為以下四種:
一、行間樣式,即直接加在標簽上的樣式 例:div style="width:50px;"/div
二、內(nèi)聯(lián)樣式 即用style /style標簽括起來寫在頁面中的樣式
三、外聯(lián)樣式:即將樣式單獨放到一個文件夾中,然后用link標簽引入頁面的形式
四,導入樣式,即將樣式,按模塊劃分或其它的分法分別放在不同的css文件中,然后用@導入到其它樣式中 。此方法建議不要用,因為效率不是特別高
前三種的優(yōu)先級為: 行間 內(nèi)聯(lián) 外聯(lián)
分享標題:css樣式應(yīng)用有幾種方式,如何應(yīng)用css樣式
文章路徑:http://www.rwnh.cn/article22/dssodcc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供響應(yīng)式網(wǎng)站、ChatGPT、軟件開發(fā)、服務(wù)器托管、自適應(yīng)網(wǎng)站、網(wǎng)站收錄
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)