小白學編程之HTML/CSS Day 002
上期回顧
在上一篇學習筆記中，主要學習了以下內容，可以翻閱《小白學編程之HTML/CSS Day 001》 查看具體內容
1.01 What is HTML | 什么是HTML
1.02 HTML tags | HTML 標簽
1.03<h1>tag | 標題標簽
1.04<p>tag | 自然段標簽
1.05<ul>和<ol>tag | 列表標簽
上篇文章發出來以后有兩點需要補充如下
- 有人問需不需要Mac，答案windos和Mac都可以，事實上只要有個瀏覽器就OK了。
- 上次我推薦在txt記事本或者W3School的在線編輯器上進行HTML練習。有親愛的讀者朋友yarving推薦可以在 codeopen 或者是 jsfiddle 上進行練習，看了一下，很酷的兩個網站。我自己比較喜歡codeopen，因為界面酷炫，不像jsfiddle需要點擊“Run”才能顯示效果。還有很重要的一點，codeopen的code需要一個字符一個字符敲，而jsfiddle有自動補全功能，個人認為對于初學小白還是一個字一個字敲比較好。所以這篇文章里將使用codeopen進行效果演示。
codeopen 截圖如下：
jsfiddle截圖如下
本期概覽
這一篇是學習HTML/CSS的第二天，主要內容有
1.06 Nesting tags| 標簽的嵌套關系
1.07<body>tag | 包含一切的<body>標簽
1.08<head>tag |<head>標簽
1.09<html>tag |<html>標簽
1.10 DOCTYPE | 設置HTML版本
1.06 Nesting tags| 標簽的嵌套關系
HTML標簽有時候會包含另外的標簽，在這種情況下，包含其他標簽的標簽叫做parent（爹和媽），被包含的標簽叫做children（娃）。
像之前在使用列表標簽時，<li> </li>被包含在<ul> </ul> （無序列表）或<ol> </ol> （有序列表），這時候<ul> </ul> 或<ol> </ol> 就被稱為parent，<li> </li>就被稱為children，如下圖所示：
1.07 <body> tag | 包含一切的<body>標簽
既然娃有爹媽，那么爹媽也有爹媽；在HTML里，所有能通過網頁顯示（純文字）內容的標簽都要被嵌套在<body> </body>標簽里。
1.08 <head> tag | <head> 標簽
既然任何網頁顯示的（文字）內容都需要放在<body></body>標簽里。言外之意，就是<body></body>之外還有標簽寫的不是（純文字）內容的顯示，這就是<head></head>。
1.09 <html> tag | <html>標簽
HTML 當然少不了<html></html>標簽，所有的HTML標簽 都要放在<html></html>標簽里面。
1.11 DOCTYPE | 設置HTML版本
DOCTYPE 翻譯為中文就是文件類型，這不是一個標簽，所以不是成對出現，只有一個<!DOCTYPE html>，這個主要是用來指定HTML 版本。設定這個之后，瀏覽器可以知道如何更好的顯示你的頁面。
擴展閱讀之，如果還想知道更多 請前往 <!DOCTYPE>聲明
最后來總結一下，
目前為止，學習了一份HTML文件包含四大類元素：DOCTYPE，<html>標簽，<head>標簽，<body>標簽，每一類里面都需要填寫不同的內容。層次結構如下圖所示：
貪多嚼不爛。建議一個字一個字敲，練習練習再練習。
用目前學到的試著敲一個作品吧！下面是我的“黯然銷魂蝦”喲。
下期預告
如何添加鏈接
歡迎來糾錯，也歡迎提意見和任何問題~~~
