如果把所有的css都寫在html檔案裡面，一旦樣式比較多的時候，就會顯得不易維護

這個時候就會選擇把所有的css內容，放在一個獨立檔案裡

然後在html中引用該檔案

通常這個檔案會被命名為style.css

示例1:

直接在html裡面寫樣式

樣式程式碼寫在style標籤裡

<style>
.p1{
  color:red;
}
 
.span1{
  color:blue;
}
</style>
 
<p class="p1">紅色</p>
 
<span class="span1">藍色</span>

示例2:

把樣式程式碼寫在style.css，並在html中包含它

建立一個檔案叫style.css
其內容為
 
.p1{
  color:red;
}
.span1{
  color:blue;
}
 

然後在html中包含該檔案
 
<link rel="stylesheet" type="text/css" href="/study/style.css" />

<link rel="stylesheet" type="text/css" href="https://how2j.cn/study/style.css" />

<p class="p1">紅色</p>

<span class="span1">藍色</span>

示例3:

css是本地檔案 如何包含

在測試的時候，大家寫的css檔案都是放在本地的，比如d:/style.css
這時就應該寫成
href="file://d:/style.css"