方式一：行內樣式
在元素標簽有跟style屬性，將樣式寫到改屬性中。格式 style=" 屬性1 : 值； 屬性2 : 值；屬性3 : 值；"多個屬性用分號“ ; ”隔開。
例：
1 <!-- 在div 后跟style屬性，等號后面寫上css樣式 --> 2 <div style="background-color:#000;color:#fff;"> 3 <h1>這是一個DIV標簽為</h1> 4 </div>
方式二：內聯樣式
在<head>標簽中加入<style>標簽將CSS樣式表寫到該標簽中。格式：.class{ 屬性1 : 值； 屬性2 : 值；屬性3 : 值 ；}，值后跟分號。
例：
1 <head> 2 <meta charset="utf-8"> 3 <title>js測試</title> 4 <!-- 內部樣式表開始 --> 5 <style > 6 .box{ 7 background-color:#000; 8 color:#fff; 9 } 10 <!-- 內部樣式表結束 --> 11 </style> 12 </head> 13 14 <body> 15 <div class="box"> 16 <h1>這是一個DIV</h1> 17 </div> 18 </body>
方式三：外聯樣式（鏈接外部樣式表）
這是一種比較實用的方式。使用方法：在<head>標簽中用<link>標簽引入。
例：
1 <link rel="stylesheet" type="text/css" href="./css/layout.css" > <!--href中寫css樣式表存放的路徑-->