HTML&CSS入門：為你的網頁換上精美的標題(Title)樣式

網頁上常看到h1, h2, h3...的蹤跡，標題是吸引人目光的一項重要要素。它能讓你想要呈現的重點很清楚地展現在讀者面前。本文介紹一些常見的標題設計，都是用CSS語法可以完成的簡單樣式，複製貼上即可使用。

標題上加上邊框

基本上使用border就可以完成。border可以設定上下左右四個邊，所以可以四個邊都加上設計，或是只挑想要設計的邊也可。

下面會展示了幾個範例，基本上都是使用以下的CSS設計衍生出來的樣式。
solid的部分可以換成dotted、dashed、double`。

.title {
  border: 3px solid #000;
}

最後一個範例展示了兩個框線，這裡使用了before的元素來實現。

標題上加上背景跟陰影

延續先前的css樣式，這次加上background搭配上before跟after能夠形成陰影效果，也可以做出其他各式的表現。
特別是最後的標籤樣式，掌握其中變化的規則後，也可以設計出其他想要的樣式。