課程目錄

2.三種應用css方式:

1)創(chuàng)建外部樣式表:

外部樣式表即創(chuàng)建后綴為css的文件,然后在想要使用的網頁中引入該文件即可。

具體的示例如下:

第一步:創(chuàng)建名為test.css的文件,并寫入以下內容:

div {

    width: 500px;

    height: 500px;

    background-color: red;

第二步:在html文件中引入該css文件,具體靠link標簽實現,該標簽寫在head標簽內,如下:

   

    Title

   

   

第三步:打開html文件,結果如下:

圖片

link標簽:

link標簽除去引入css文件外,還有其它的作用,但是文中沒有具體給出。然后,link標簽的兩個屬性:

rel="stylesheet" 指明文件格式(stylesheet指的就是css文件)

href = “url” 指明引入css文件的地址

2)創(chuàng)建嵌入式樣式表:

嵌入式樣式表,通過html中的style標簽實現,里面直接寫入css代碼即可。如下代碼所示:

   

    Title

   

   

結果如下:

圖片

3)創(chuàng)建內聯(lián)式樣式:

這個靠的是HTML標簽內共有的一個屬性style中,如下:

   

    Title

   

結果如下:

圖片

可以看出的是,style屬性值中不同的樣式用分號隔開。

4)三者的比較:

首先最為推薦的是外部樣式表,其次是嵌入式樣式。最后才是內聯(lián)式的。因為我們一般寫代碼的一個目標是實現代碼分離,即HTML代碼和CSS代碼分離,這樣寫的代碼干凈易懂。

5)重要性:

前一個章節(jié)提及了對于某個標簽來說,會有多個css樣式,發(fā)生沖突是很常見的。而在其它條件相同的情況下,內聯(lián)式是最重要的,因為它最晚出現,其它的都出現在head標簽內,而內聯(lián)式出現在body標簽內。

3.使用與媒體相關的樣式表:

可以指定一個只用于特定輸出的樣式表,如只用于打印,或只用于用瀏覽器在屏幕上查看。

其中,指定方法如下:

使用標簽:link標簽

使用屬性:media

media屬性的值:print(打印)、screen(屏幕顯示)、all(默認聲明)(當然還有其它值,但是這三者是最為常用的)

  示例如下:

   

    Title

   

   

   

這段代碼的意思是:當我們使用瀏覽器查看網頁的時候,screen.css里面的代碼會發(fā)揮作用,當我們打印網頁時候,print.css里面的代碼會發(fā)生作用。

除去上面的使用方法外,還有一種方法,就是在css代碼中使用,如下:

@media print {

    div {

        width: 100px;

        height: 100px;

        background-color: pink;

    }

}

div {

    width: 100px;

    height: 200px;

    background-color: red;

}

這樣,第一行代碼代表當打印的時候起作用的樣式。

4.提供替代的樣式表:

規(guī)范允許設置一組基本的持久性樣式,一組默認樣式和多組可替代樣式表。你可以這樣理解,你有一個網頁,基本的持久性的樣式就是網頁框架的基本樣式,而一組默認樣式就是我們個人主頁的基本樣式,我們想要調整樣式,就是使用了可替代的樣式表。

如下代碼所示:

   

    Title

   

   

   

其中,rel="alternate"代表著這個樣式就是可替代的樣式表。

老實說,我覺得這不就是多寫幾個css文件嘛,只是用處不同而已^_^。


郵箱
huangbenjincv@163.com

广昌县| 阜南县| 都匀市| 时尚| 东宁县| 平阴县| 克东县| 达尔| 永平县| 汝南县| 南岸区| 慈利县| 虞城县| 新泰市| 新兴县| 收藏| 仙游县| 繁昌县| 苍南县| 哈密市| 大城县| 闽清县| 阿巴嘎旗| 曲松县| 怀安县| 华坪县| 石门县| 米易县| 田林县| 雷山县| 浦江县| 平邑县| 介休市| 长岭县| 富源县| 松江区| 武宁县| 眉山市| 昭通市| 河间市| 大田县|