在網頁開發中，HTML和CSS是兩個不可分離的部分，其中CSS主要用于控制網頁的樣式和布局。在實際的開發過程中，我們通常會把CSS代碼從HTML代碼中分離出來，以提高代碼的可維護性和可讀性。
分離CSS代碼的方法有多種，以下是其中一種常見的做法：
1. 創建CSS文件
首先，我們需要創建一個新的CSS文件，用于存放所有的樣式規則。我們可以用文本編輯器來創建這個文件，然后將它保存為一個以.css為后綴名的文件。
2. 鏈接CSS文件
將新創建的CSS文件與HTML文件連接起來。有兩種方法可以實現這一點：
a) 在HTML文件中通過<link>標簽引入CSS文件。<link>標簽通常放在<head>標簽中間，如下所示：
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>在這個例子中，我們將外部的CSS文件命名為“style.css”，它的路徑相對于HTML文件的位置。 b) 也可以將CSS代碼直接放在HTML文件中，不過這種做法通常只用于一些小型網站，而對于大型網站則不太實用。我們可以使用<style>標簽來包含CSS代碼，如下所示：
<head> <style type="text/css"> /* CSS代碼 */ </style> </head>3. 將CSS代碼復制到CSS文件中 最后，我們需要將HTML文件中的CSS代碼復制到新創建的CSS文件中。為了遵循最佳實踐，我們可以把相同的規則組合在一起，以便更容易地維護。 例如，以下是一個HTML文件中的CSS代碼：
<style type="text/css">
body {
font-family: sans-serif;
font-size: 16px;
color: #333;
background-color: #f5f5f5;
}
.container {
max-width: 960px;
margin: 0 auto;
padding: 20px;
}
h1, h2, h3 {
font-weight: bold;
margin-bottom: 10px;
}
</style>我們可以將它分離為一個CSS文件，如下所示：body {
font-family: sans-serif;
font-size: 16px;
color: #333;
background-color: #f5f5f5;
}
.container {
max-width: 960px;
margin: 0 auto;
padding: 20px;
}
h1, h2, h3 {
font-weight: bold;
margin-bottom: 10px;
}通過這樣的方式，我們可以把CSS代碼從HTML文件中分離出來，使得代碼更加清晰明了，并可以更容易地對其進行維護和修改。