Bear在這裡買的
amazon的參考
HTML5和CSS3實例教程/圖靈程序設計叢書
作者：(美)霍根|譯者:李傑//劉曉娜//朱嵬
出版社：人民郵電
ISBN：9787115267245
出版日期：2012/01/01
頁數：192
人民幣：RMB 39 元
※整體來說，這本書非常淺顯易懂，用非常簡短的幾行的例子來說明。但要注意的是，有些內容似乎過時了，看的時候要小心求證，別太過相信它嘿。
P.6(原文.P.20)
你應該使用CSS或JavaScript來設計頁面布局，而不是使用框架。
You should be looking at ways to lay out your interfaces without frames, using regular CSS or some JavaScript.
P.7(原文.P.21)
如果像下面這樣在鍵接上使用屬性：
If you use target on your links, like this:
<a href="http://www.google.com" target="_blank">
那麼，最好通過使用JavaScript來代替target屬性，因為target屬性在布範中被廢棄了。
you’ll want to look at using JavaScript instead, because target is deprecated.
Bear: 但實際上好像沒被廢棄，連W3C SPEC上都還看的到
P.13(原文.P.29)
Bear: <title>, <head>, <header>, <h1> 要搞清楚作用和差別
P.16(原文.P.33)
我們可以將section 標籤視為對文檔邏輯部份的描述，而將article標籤視為對具體內容的描述。
Think of a section as a logical part of a document. Think of an article as actual content, such as a magazine article, blog post, or news item.
Bear: 作者這句話非常的有用，還對section 及 article這二個用途搞不清楚的可以參考。
P.18(原文.P.34)
博客右側是一個側邊欄，內含指向博文列表的鍵接。倘若你認為可以使用aside標籤來定義博客側邊欄就大錯特錯了。盡管可以那麼做，但會違背規範的精神。
Our blog has a sidebar on the right side that contains links to the archives for the blog. If you’re thinking that we could use the aside tag to define the sidebar of our blog, you’d be wrong. You could do it that way, but it goes against the spirit of the specification. The aside is designed to show content related to an article. It’s a good place to show related links, a glossary, or a pullout quote.
P.24(原文.P.42)
preventDefault方法用於阻止預設的單擊事件行為。在示例中，它阻止了頁面跳轉。
We use a jQuery selector to grab the element with the class of popup, and then we add an observer to each element’s click event. The code we pass to the click method will be executed when someone clicks the link. The preventDefault method prevents the default click event behavior. In this case, it prevents the browser from following the link and displaying a new page.
P.26(原文.P.44)
自定義數據屬性允許開發人員在頁面中嵌入真實有用的數據。
You can also use them to display dates and times in a user’s time zone while still caching the page. Simply put the date on the HTML page as UTC, and convert it to the user’s local time on the client side. These attributes allow you to embed real, usable data in your pages, and you can expect to see more and more frameworks and libraries taking advantage of them. I’m sure you’ll find lots of great uses for them in your own work.
P.29(原文.P.49)
label標籤的for屬性用於引用與其相關聯的表單元素的id。這種用法有助於屏幕閱讀器識別頁面上的表單域。有序列表提供了一種良好的展現形式來列出表單域，從而避開了複雜的表格結構或 div 結構。
Notice that we are marking this form up with labels wrapped in an ordered list. Labels are essential when creating accessible forms. The for attribute of the label references the id of its associated form element. This helps screen readers identify fields on a page. The ordered list provides a good way of listing the fields without resorting to complex table or div structures. This also gives you a way to mark up the order in which you’d like people to fill out the fields.
P.37(原文.P.60)
HTML5引入了 autocomplete 屬性，用以通知瀏覽器不要為當前表單域自動填充數據。
You may have noticed we’ve added the autocomplete attribute to the password fields on this form. HTML5 introduces an autocomplete attribute that tells web browsers that they should not attempt to automatically fill in data for the field. Some browsers remember data that users have previously typed in, and in some cases, we want to tell the browsers that we’d rather not let users do that.
P.57(原文.P.82)
用CSS渲染頁面非元素非常簡便，尤其是當我們無法改變HTML結構時，無需添加額外的標記，僅利用語義層和新的元素選擇器即可渲染頁面元素，你會發現代碼變得更易於維護了。
Styling elements is a whole lot easier with CSS3, especially if we don’t have the ability to modify the HTML we’re targeting. When you’re styling interfaces, use the semantic hierarchy and these new selectors before you add additional markup. You will find your code much easier to maintain.
P.57(原文.P.83)
CSS不僅可以渲染已經存在的元素，還可以向文檔中注入內容。
CSS can style existing elements, but it can also inject content into a document. There are a few cases where content generation with CSS makes sense, and the most obvious one is appending the URL of a hyperlink next to the link’s text when a user prints the page. When you’re looking at a document on the screen, you can just hover over a link and see where it goes by looking at the status bar. However, when you look at a printout of a page, you have absolutely no idea where those links go.
Bear: 利用CSS改變最終輸出，但原始HTML檔未被改變。想像一下如果你不能動source code，但卻要改上面的東西時的狀況。
