首先上一個樣式的例子css
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> This is my HTML</title> <!-- 定義樣式--> <style type="text/css"> h2 {color: red} p {color: green} </style> </head> <body> <h2>紅顏色</h2> <p>綠顏色</p> </body> </html>
HTML中經常使用的三種方式插入樣式表
html
1>外部樣式表
code
在一個工程中,每一個頁面的共同部分能夠採用外部樣式表。使用外部樣式表,咱們能夠經過更改一個文件來改變整個工程的外觀。htm
<head> <link rel="stylesheet" type="text/css" href="mySelfStyle.css"> </head>
以下圖是個人此次工程中的一個頁面用到的外部樣式表utf-8
2>內部樣式表
it
當單個文件須要特別樣式時,能夠使用內部樣式表,咱們能夠在head中經過<style>標籤訂義內部樣式表。class
<head> <style type="text/css"> body {background-color: red} p {margin-left: 20px} </style> </head>
3>內聯樣式
meta
當特殊的樣式須要應用到個別元素時,就能夠使用內聯樣式。使用內聯樣式的方法是在相關的標籤中使用樣式屬性。方法
<p style="color: red; margin-left: 100px">設置段落顏色爲紅色,距離左邊100px</p>