初探HTML
1使用元素
1.這裏用粗體標明元素，code為標簽，其中<code>為開始標簽，</code>為結束標簽；<code>apples</code>標簽與元素一起稱為code元素
I like <code>apples</code> and bannner
註意：有些html標簽會改變呈現形式，例如<code>，盡量不要這樣，未使用css，讓內容和呈現分離開來
2.使用空元素
有些元素為空時是沒有意義的，但他任然為有效的HTML代碼。
I like <code></code>
3.使用自閉和標簽
元素可以簡潔的只用一個元素表示，下面就是只用一個標簽表示空元素
I like </code> and bannner
4.虛元素
有些元素只能使用一個標簽表示，在其中放置任何內容都是不符合HTML規範的。這些元素為
虛元素。
他有兩種表示方法：
1）開始標簽
I like apples and bannner,
<hr>
I like bannner
2)結束標簽
1 I like apples and bannner,
2 <hr/>
3 I like bannner
提一句：hr也是帶有呈現形式含義的元素，他會顯示為一條橫線
1.2使用元素屬性
元素可以使用屬性（attribute）進行配置。
href為屬性名，它專屬於a標簽，表示跳轉的地址；"/app.html"為屬性值
I like <a href="/app.html">apple</a> and orange.
1.2.1一個元素對應多個屬性
一個元素可以對象多個屬性，他們之間用空格隔離開，且沒有先後順序
I like <a href="/app.html" id="firstlink" class="a-link">apple</a> and orange.
1.2.2使用布爾屬性
有些屬性屬於布爾屬性，這些屬性不需要設定一個值，只需要將屬性名添加到元素中就可以了。
例如下面：布爾屬性為disabled，其實就是disabled=“true”，
your name：<input disabled>
與下面的代碼等價
your name：<input disabled=""> your name：<input disabled="disabled">
1.2.2使用自定義屬性
用戶可以自定義屬性，這種屬性必須以data-開頭。加data-是為了以免將來出新屬性和你的一樣，比如出了hcd屬性，避免不必要的沖突
your name：<input disabled="" data-hcd="hcd">
1.3創建html文檔
html文檔大部分是針對瀏覽器創建的。用於處理HTML文檔的各種軟件有一個共同的名稱叫做用戶代理。瀏覽器是最為流行的用戶代理，但是不是唯一的一種
1.3.1外層結構
HTML的外層結構由兩個元素確定:DOCTYPE和html
<!DOCTYPE html> <html lang="en"> </html>
上例中的DOCTYPE元素讓瀏覽器明白處理的是HTML文檔，
以html開頭,告訴瀏覽器直到html結束標簽，所有的內容都應當按照html來處理
1.3.2元數據
HTML文檔的元數據部分可以用來向瀏覽器提供文檔的一些信息。元數據包含在head元素內部
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>this is title</title>
5 </head>
6 </html>
這裏只是簡單舉個例子,還有很多是可以提供的，例如引入css
1.3.3內容
文檔的第三部分是文檔的內容，這也是最後一部分，放在body元素之中，主要放置向用戶顯示的內容
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 </head>
7 <body>
8 I like <code>apple</code> and orange.
9 </body>
10 </html>
1.3.4父元素，子元素，後代元素和兄弟元素
例如：
1 <ul> 2 <li> 3 <span>this is span</span> 4 </li> 5 <li> this is li</li> 6 </ul>
上面的代碼中:ul --- li的父元素，
li --- span的父元素，
span--- ul的後代元素，
li --- li的兄弟元素
1.3.5了解元素類型
HTML元素：1.元數據元素 2.流元素 3.短語元素
1.元數據元素：用來構建HTML文檔的基本結構，以及對該如何處理文檔向瀏覽器提供信息和指示。
2.流元素和短語元素的用途是確定一個元素的合法的父元素和子元素的範圍。短語元素是HTML的基本成分。流元素是短語元素的超集。就是說所有的短語元素都是流元素，而流元素不一定是短語元素。
1.4HTML5全局屬性
每種元素都可以規定自己的屬性，這種屬性稱為局部屬性。每一個局部屬性都可以用來控制元素獨有行為的某個方面。
全局屬性：他們用來配置多有元素共有的行為，全局屬性可以用在任何一個元素身上。
1.4.1 accesskey屬性
使用accesskey可以設定一個或者幾個用來選擇頁面上的元素的快捷鍵。
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 </head>
7 <body>
8 <form>
9 Name:<input type="text" name="name" accesskey="n">
10 <br>
11 password:<input type="password" name="password" accesskey="p">
12 <br>
13 value<input type="text" name="value" accesskey="s">
14 </form>
15 </body>
16 </html>
對於上面的代碼，在window系統中，利用 Alt+accesskey屬性值 可以快速切換，例如Alt+s可以快速切換到value的input，Alt+n可以快速切換到name的input
1.4.2 class屬性
給元素定義一個類，對這個類進行操作，或是增加樣式或是js操作
1.4.3 contenteditable
contenteditable是HTML5中新增的元素，其用途是讓用戶能夠修改頁面上的內容。屬性值為true為可以修改，false為不可修改
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 </head>
7 <body>
8 <p contenteditable="true">this is a big apple</p>
9 </body>
10 </html>
1.4.4 id
給元素的唯一標識，id應當是唯一的。
1.4.5 lang
說明元素內容使用的語言。
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 </head>
7 <body>
8 <p lang="en">hello - how are you</p>
9 <p lang="fr">Bonhjir - asdas </p>
10 <p lang="es">Holar asdsdd </p>
11 </body>
12 </html>
lang屬性值必須用ISO語言代碼。
初探HTML