前期準備 2本書：《HTML5從入門到精通》清華大學出版社，《Head First HTML與CSS》中國電力出版社； 1個編譯器：sublime； 幾種瀏覽器用於測試網頁：Firefox、chrome、360、IE； 2個主要的學習網站：慕課網:http://www.imooc.com/，w3sc ...
前期準備
2本書：《HTML5從入門到精通》清華大學出版社，《Head First HTML與CSS》中國電力出版社；
1個編譯器：sublime；
幾種瀏覽器用於測試網頁：Firefox、chrome、360、IE；
2個主要的學習網站：慕課網:http://www.imooc.com/，w3school:http://www.w3school.com.cn/h.asp;
還有一顆安定的心、沉下心去學。
開始學習
一、HTML與CSS初步認識
HTML是網頁的結構（相當毛坯房，還未進行裝修），CSS是來定義樣式的（相當於裝修）；所以這兩種語言共同構成了網頁，其實在HTML中標簽的屬性style也可以定義樣式，HTML結構與CSS定義如下中如下：
<html>
<head>
<title>Starbuzz Coffees</title>
<style type="text/css">
body{
background-color: #d2b48c; <!--背景顏色-->
margin-left: 20%;<!--左外邊距-->
margin-right: 20%;<!--右外邊距-->
border: 2px dotted black ;<!--內容邊框-->
padding:10px 10px 10px 10px;<!--內容與內容邊框的內邊距-->
font-family: sans-serif;<!--字體-->
}
</style>
</head>
<body>
</body>
</html>
二、超鏈接（HT hypertext)
語法：<a href=""> </a>，
註意事項：
源文件與目標文件的相對位置
三個頁面：lounge.html（主頁）、elixir.html(跳轉頁1)、directions.html（跳轉頁2）
文件beverages、about在lounge中。
<a href="beverages/elixir.html ">elixirs</a><!--elixir.html文件在beverages中-->
<a href="about/directions.html ">directions</a><!--directions.html在about中-->
<a href="../images/lounge.html ">Back to the lounge</a><!--directions.html、directions.html跳回lounge.html-->
下一、二級：name1/name2/目標文件
先上二級後下一級：../../下一級name1/目標文件
