外部CSS定義和如何鏈接到一個
當網絡瀏覽器加載網頁時,其出現方式取決於級聯樣式表中的信息。 HTML文件有三種使用樣式表的方法:外部,內部和內嵌。
內部和內嵌樣式表存儲在HTML文件本身內。 他們現在很容易處理,但因為他們沒有存儲在中心位置,所以不可能一次輕鬆更改整個網站的樣式; 您必須重新輸入每個條目並手動更改。
但是,使用外部樣式表時,呈現頁面的指示信息存儲在單個文件中,這使得在整個網站或多個元素上編輯樣式非常容易。 該文件使用.CSS文件擴展名,HTML文檔中包含該文件位置的鏈接,以便Web瀏覽器知道在何處查找樣式說明。
一個或多個文檔可以鏈接到同一個CSS文件,並且一個網站可能有許多獨特的CSS文件用於樣式化不同的頁面,表格,圖像等。
如何鏈接到外部樣式表
每個想要使用特定外部樣式表的網頁都需要從部分鏈接到CSS文件,就像這樣:
head>在這個例子中,唯一需要修改以適用於自己的文檔的是styles.css文本。 這是你的CSS文件的位置。
如果該文件實際上稱為styles.css,並且與鏈接到該文件的文檔位於完全相同的文件夾中,那麼它可以保持與上面的完全一樣。 然而,很可能你的CSS文件的標題是別的,在這種情況下,你可以將名稱從“樣式”更改為任何你的名字。
如果CSS文件不在這個文件夾的根目錄下,而是在一個子文件夾中,它可能會這樣讀取:
head>有關外部CSS文件的更多信息
外部樣式表的最大好處是它們不受任何特定頁面的束縛。 如果樣式是內部或內嵌執行的,則網站上的其他頁面不能指向這些樣式偏好。
然而,使用外部樣式,相同的CSS文件可以用於網站上的每一個頁面,以便它們都具有統一的外觀,並且編輯整個網站的CSS內容非常簡單和集中。
你可以看到如何在以下作品...
內部樣式需要使用標籤,因為它們需要與標籤區分:
body {background-color:green; } h1 {color:blue; margin-left:15px; } style> head>但是,由於外部樣式表包含在它們自己的文件中,因此可以像這樣創建它們,這意味著與上述示例完全相同:
body {background-color:green; } h1 {color:blue; margin-left:15px; }在這些示例中,內聯樣式僅適用於特定頁面,顯然它包含在該HTML頁面的標題詳細信息中。 在第二個例子中,CSS信息是自包含在CSS文件中的,任何頁面都可以鏈接到使用上面的鏈接到外部樣式表部分的代碼。