css如何實現內聯式、嵌入式和外部式

發布時間：2022-03-23 14:25:30 來源：億速云閱讀：149 作者：小新欄目：web開發

小編給大家分享一下css如何實現內聯式、嵌入式和外部式，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

1,內聯式css樣式

就是把css代碼直接寫在現有的HTML標簽中，如下面代碼：

<p style="color:red">這里文字是紅色。</p>

css樣式代碼要寫在style=""雙引號中，如果有多條css樣式代碼設置可以寫在一起，中間用分號隔開。如下代碼：

<p style="color:red;font-size:12px">這里文字是紅色。</p>

2,嵌入式css樣式，

就是可以把css樣式代碼寫在<style type="text/css"></style>標簽之間。如下面代碼實現把三個<span>標簽中的文字設置為紅色：

span{

color:red;

}

</style>

嵌入式css樣式必須寫在<style></style>之間，并且一般情況下嵌入式css樣式寫在<head></head>之間。

3,外部式css樣式

寫在單獨的一個文件中

外部式css樣式(也可稱為外聯式)就是把css代碼寫一個單獨的外部文件中，這個css樣式文件以“.css”為擴展名，在<head>內（不是在<style>標簽內）使用<link>標簽將css樣式文件鏈接到HTML文件內，如下面代碼：

注意：

1、css樣式文件名稱以有意義的英文字母命名，如 main.css。

2、rel="stylesheet" type="text/css" 是固定寫法不可修改。

3、<link>標簽位置一般寫在<head>標簽之內。

看完了這篇文章，相信你對“css如何實現內聯式、嵌入式和外部式”有了一定的了解，如果想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！

向AI問一下細節