我學習前端的時間不長，短短1個月而已，只學了些HTML5和CSS3還有少許javascript，另外還有網頁布局等等輔助性書籍，我在模仿網頁以及完成百度前端技術學院的任務過程中發現了我容易忘記的標簽以及一些屬性，如今列出來，即為分享也為記錄給自己查閱。
首先說說html吧，我看的是html5，當然也接觸過html4.01，以前還在想，要不要考慮html5的兼容性，現在發現沒必要了。html5只是有的新標簽兼容性還不好，其他的和html4.01還是變化不大的，另外就是html5的文檔類型和字符說明都得到簡化，其標簽更人性化、效率更高、更安全。在html（主要是html5）重要的標簽詳解如下：
1、header、footer、section、article、aside、nav、hgroup對於這些新增元素，我覺得還是有必要的，以前在網上課堂學的是div+css布局網頁，那種方法確實很實用，但是觀察html結構，整篇的div和id名，現在覺得確實有點單調，而且div的命名都是人規定的，每個人都有自己的命名方法（后續會發布命名規范），這大篇幅的div會影響網頁的解析速度並且不利於后期維護。html5采用這些新標簽，就是來解決這個問題的，剛剛學覺得這些標簽沒什么用，但是后來才知道這些標簽並不是當作div容器來用的，整體網頁先規划頭尾和主題內容，分幾個部分等。大方向上規划好了之后，再用div容器布局，這些標簽都可以相互嵌套，具體怎么用，要看網頁的內容是什么。header和nav一般用作頁面的頭部分和導航，每一個部分可以有自己的article和section以及footer。article和section的作用，article是文章的主體部分一般比較獨立，沒有兄弟節點。而section標簽可以有兄弟節點，其目的是為了分區，分好區后div再分配空間。至於aside用於表達注記、貼士、側欄、摘要、插入的引用等作為補充主體的內容，從一個簡單的頁面來看就是一個側邊欄。用在兩個地方
a、被包含在article元素中作為主要內容的附屬信息部分，其中的內容可以是與當前文章有關的相關資料、名次解釋，等等。
<article> <h1>…</h1><p>…</p><aside>…</aside></article>
b、在article元素之外使用作為頁面或站點全局的附屬信息部分。最典型的是側邊欄，其中的內容可以使友情鏈接，博客中的其它文章列表、廣告單元等。
<aside> <h2>…</h2>
<ul>
<li>…</li>
<li>…</li>
</ul> <h2>…</h2> <ul>
<li>…</li> <li>…</li> </ul> </aside>
HTML5 增加了很多語義化的標簽，hgroup 就是其中一個，它用來表明標題的集合。如果有主標題、副標題，可以使用這個來包裹一下，一般比較常見的就是網站的標題和網站描述：但是這樣做並不是太必要，而且還有一些麻煩。一般來說，很難有單純的 hn 標題標簽集合在一起，通常還包含一些其他內容，但是使用 hgroup 包裹的內容，必須是 hn 標題標簽，否則不會通過 HTML5 驗證。又有誰會為了這么一個增強語義性用處不大的標簽專門去生成一堆 hn 標簽？然后好消息是，這個標簽在最新的 HTML5.1 版中被廢除了，以后可以不再用了。總之這些標簽都是提高了網頁編碼的可讀性，更人性化，讓后期維護不再苦逼！！望大家好好用這些標簽，總結不好還請指正交流！！
2、多彩的表單、對於表單來說，確實是很頭疼的問題，其中有很多細節要把握。html5新增了許多表單屬性，目前各瀏覽器並沒有很好的實現這些屬性，所以用時要考慮瀏覽器不支持的情況。常用的表單輸入類型有：text、radio、checkbox、option、password、submit、button（一、定義和用法<button> 標簽定義的是一個按鈕。在 button 元素內部，可以放置文本或圖像。這是<button>與使用 input 元素創建的按鈕的不同之處。二者相比較， <button> 控件提供了更為強大的功能和更豐富的內容。<button> 與 </button> 標簽之間的所有內容都是按鈕的內容，其中包括任何可接受的正文內容，比如文本或多媒體內容。例如，我們可以在按鈕中包括一個圖像和相關的文本，用它們在按鈕中創建一個吸引人的標記圖像。唯一禁止使用的元素是圖像映射，因為它對鼠標和鍵盤敏感的動作會干擾表單按鈕的行為。請始終為按鈕規定 type 屬性。Internet Explorer 的默認類型是 "button"，而其他瀏覽器中（包括 W3C 規范）的默認值是 "submit"。
二、瀏覽器支持所有主流瀏覽器都支持 <button> 標簽。重要事項：如果在 HTML 表單中使用 button 元素，不同的瀏覽器會提交不同的值。Internet Explorer 將提交 <button> 與 <button/> 之間的文本，而其他瀏覽器將提交 value 屬性的內容。請在 HTML 表單中使用 input 元素來創建按鈕
三、注意事項
在使用<button>標簽時很容易想當然的當成 <input type="button">使用，這很容易產生錯誤用法：
通過$('#customBtn').val()獲取<button id="customBtn" value="test">按鈕</button> value的值,在IE(IE內核)下這樣用到得的是值是“按鈕”，而不是“test”，非IE下得到的是“test”。 參加上面標紅的第一句話。 這一點要和<input type="button">區分開。）、
image、hidden、reset、file、這些常見的都應該知道的。新增的有email（自動檢測輸入是否符合email格式，在以前需要用javascript來控制）、url、number、range、datepickers(date、month、week、time、datetime、datetime-local)、search、tel、color。新增的input屬性解釋：autocomplete在input類型的輸入框中實現自動完成輸入內容，有三種值分別是on、off、空值，默認為off。autofocus：可以使在頁面加載時，某表單控件自動獲取焦點，適用於所有input類型.表單的重寫屬性：formaction、formenctype、formmethod、formnovalidate、formtarget這些都比較簡單，忘了可以參考一下。
3、canvas畫布包含內容比較多，而且會成為未來web網頁的主流，以后會專門拿出來寫的，這里面包含大量的數學知識，計算機圖形學。
4、alt、title、longdesc、datetime這些屬性的功能是：alt和title定義元素的替換文本和提示文本一般用於圖片的超鏈接對於input元素，alt屬性用來替換提交按鈕的圖片
5、blockquote、cite、q標識引用文本cite一般用來定義引用信息的URL，blockquote表示引用文本，一般可以這么用
<blockquote cite="http:://......"><p>xxxxxxxx</p></blockquote>,q也是表示引用文本，用的時候會打引號。