如何在HTML頁面中包含CSS樣式

2021-09-24 02:55:30 字數 817 閱讀 8546

1、行內樣式

這個方式是直接在html的標籤中插入 style="屬性:屬性值;..." 這個屬性

這是最簡單的一種插入方式,所以這個插入方式看上去很low

行內樣式的缺點主要有兩個:

一、w3c標準是:內容、樣式、行為三者分開,這個嵌入方式不符合w3c規範,並且**亂,不好維護

二、**冗餘,相同的style得寫多次,不可復用

2、內嵌式

在html中的head中插入style標籤 在中間寫css**

這個方式解決了同一頁面多個標籤需要寫多分style屬性的問題

但是內嵌式無法實現在多個html都要使用這個css樣式的功能

3、連線式

在html的head中插入

href中的是要插入的樣式的css檔案

通過連線式解決了多個html使用乙個css樣式的問題

4、匯入式

head中插入style標籤

匯入式一般不用

四種插入方式的優先順序

若四種方式同時使用,那麼他們都會生效果;

若碰到相同的屬性,且都修改了同樣屬性,後定義的生效;

若內嵌與匯入式放到一起,始終是內嵌式起作用;

如何選擇使用內嵌式還是鏈結式

內嵌式雖然沒有解決多個html頁面服用乙個css樣式的問題 但是瀏覽器在載入的時候只需要載入這乙個css樣式,速度比較快

根據實際情況考慮,若追求的是速度,對**復用問題不較真,推薦使用內嵌式

若追求的是**的可服用,那麼就得捨棄一點速度,來使用鏈結式來嵌入css樣式。

css.檔案跟html檔案,分開放置,有益於自己偵查改錯等.也有利於編寫大型程式

如何在html中應用css

css cascading style sheets 層疊樣式表,是乙個用於修飾文件 可以是標記語言html,也可以是xml或者svn 的語言,可以將文件以更優雅的形式呈現給使用者。css語言的核心功能就是為特定的屬性設定特點的值,css引擎通過計算出宣告的每個屬性來顯示元素。css的屬性和值都是大...

如何在html頁面中展示html原始碼

輸入框是可以展示html原始碼的,如下 value 文字輸入框是可以展示html原始碼的,如下 console.log 12 script textarea 標籤之間的內容不會被當作文件內容解析,而會被用等寬字型直接呈現,包括空格和換行也可以展現。但是不建議使用!改用 注意 style backgr...

如何在html中引入全域性CSS

在使用css的時候為了方便需要單獨定義乙個css檔案,也就是要定義乙個全域性的css檔案,在定義了全域性的css檔案之後如何在html檔案 中引入css呢?下面的是方法 css檔案的副檔名是.css。1 鏈結方式 通過head標籤中link標籤來實現,前提也是先要有乙個已定好的css檔案。例 注 可...