JavaScript_css

css

    css:層疊樣式表;將網頁中的樣式分離出來,完全由css來控制,增強了樣式的複用性以及可擴展性。

    格式:選擇器{屬性名:屬性值;屬性名:屬性值…}

    css和html代碼相結合的四種方式:

        1、每一個html標籤都有一個style屬性;

        2、當頁面有多個標籤有相同樣式時,可以進行復用。

            <style>

                css代碼

            </style>

        3、當有多個頁面中的標籤的樣式相同時,還可以將樣式單獨封裝成一個css文件。

            通過在每個頁面中定義

                <style>

                    @import url(“1.css”)

                </style>

        4、通過html中head標籤中的link標籤連接一個css文件。

                <link rel=”stylesheet” href=”1.css”/>

    技巧:爲了提高相同樣式的複用性以及可擴展性,可以將多個標籤樣式進行單獨定義,並封裝成css文件。

        p.css,div.css…

    在一個css文件中使用css的import將多個標籤樣式文件導入,然後在html頁面上,使用link標籤導入這個總的css文件即可。

        1.css

        @import url(“p.css”)

        @import url(“div.css”)

        <link rel=”stylesheet” href=”1.css”/>

    選擇器:其實就是樣式要作用的標籤容器。

        當樣式分離後,html作用在於用標籤封裝數據,然後將css加載到指定標籤上。

    選擇器的基本分類:

        1、標籤選擇器:其實就是html中的每一個標籤名。

        2、類選擇器;其實就是每一個標籤中的class屬性,用.的形式表示。只用來給css所使用,可以對不同標籤進行相同樣式設定。

        3、ID選擇器:其實就是每一個標籤中的ID屬性,但是要保證ID唯一性。用#來標識。ID不僅僅被css所使用,還可以被javascript所使用。

    選擇器的優先級:ID>class>標籤

    擴展選擇器:

        1、關聯選擇器:其實就是對標籤中的標籤進行樣式定義, 選擇器 選擇器…

        2、組合選擇器:對多個選擇器進行相同樣式定義,將多個選擇器通過,隔開的形式。

        3、僞元素選擇器:其實就是元素的一種狀態。

            a:link :超鏈接點擊前狀態;

            a:visited:超鏈接點擊後狀態;

            a:hover:懸停在超鏈接上的狀態;

            a:active:點擊超鏈接時的狀態;

            在定義這些狀態時,有一個順序:LVHA

            p:first-letter

            p:first-line

            :focus:IE6不支持,但FF支持。

    css濾鏡:其實就是一些代碼完成豐富了樣式。

    當使用到css更多的屬性時,還需要查閱css的API。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章