CSS（層疊樣式表）與HTML（超文本標記語言）一起使用可以為網站設計提供更多的自由度和美學效果。以下是CSS與HTML結合方法。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS與HTML結合方法</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}
h1 {
color: #333;
text-align: center;
margin-top: 50px;
}
p {
font-size: 1.2em;
line-height: 1.5em;
color: #666;
margin-left: 20px;
}
.box {
background-color: #fff;
border: 1px solid #ddd;
margin: 20px auto;
padding: 20px;
width: 80%;
max-width: 600px;
border-radius: 5px;
box-shadow: 0 0 10px #ddd;
}
.box h2 {
color: #333;
margin-top: 0;
}
</style>
</head>
<body>
<h1>CSS與HTML結合方法</h1>
<div class="box">
<h2>使用CSS樣式美化HTML</h2>
<p>CSS可以用來美化HTML元素，使網站更具吸引力。例如，為段落添加行距、顏色和字體大小等。</p>
</div>
</body>
</html>如上代碼中，HTML的主要構建結構（標簽、元素和屬性）都以HTML的方式編寫。注意，CSS樣式表是以<style>標簽表示，這個標簽必須放在<head>標簽中。CSS用來美化HTML元素使其更美觀和易讀，如上述代碼中的<p>和.box，用CSS控制它們的樣式以達到更好的視覺呈現效果。
通過CSS和HTML的結合，你可以為頁面的集體、區域和單個元素的外觀、大小、位置、顏色和其他樣式特性設定不同的樣式，消除了表格布局、動態頁面調用等問題，同時增加了網站設計的便捷性。