HTML5+Bootstrap 學習筆記 4

HTML5 <map> <area> 標籤

<map> 標籤訂義客戶端的圖像映射。圖像映射是帶有可點擊區域的圖像。

<area> 標籤訂義圖像映射內部的區域（圖像映射指的是帶有可點擊區域的圖像）。

area 元素始終嵌套在 <map> 標籤內部。

1 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" />
2 
3 <map id ="planetmap">
4  <area shape ="rect" coords ="0,0,82,126" href ="sun.htm" alt="Sun" />
5  <area shape ="circle" coords ="90,58,3" href ="mercur.htm" alt="Mercury" />
6  <area shape ="circle" coords ="124,58,8" href ="venus.htm" alt="Venus" />
7 </map>

參考資料：HTML 5 <map> 標籤 http://www.w3school.com.cn/html5/html5_map.asp

　　　　　HTML 5 <area> 標籤 http://www.w3school.com.cn/html5/html5_area.asp

---

HTML5 <section> 標籤

<section> 標籤訂義文檔中的節（section、區段）。好比章節、頁眉、頁腳或文檔中的其餘部分。

1 <section>
2   <h1>PRC</h1>
3   <p>The People's Republic of China was born in 1949...</p>
4 </section>

section會影響整個文檔大綱的生成，切忌將section理解爲一個語義化的div。

參考資料：HTML 5 <section> 標籤 http://www.w3school.com.cn/html5/html5_section.asp

---

Bootstrap glyphicon glyphicon-chevron-right ">" 垂直居中的問題（單元高不固定）

該問題並未找到好的解決方案，在此記錄參考資料，以備進一步研究。

http://stackoverflow.com/questions/21749372/how-to-center-an-icon-vertically-when-using-bootstrap-3-grid

http://stackoverflow.com/questions/21588819/twitter-bootstrap-carousel-arrows-not-centered-vertically-depending-on-glyphicon

http://jsfiddle.net/AdF6b/2/

http://jsfiddle.net/KyleMit/Z9ZFr/

http://stackoverflow.com/questions/21460610/centering-a-glyphicon-inside-a-div

http://stackoverflow.com/questions/22719315/vertical-align-glyphicon-in-bootstrap-3

---

 Bootstrap 使整個 panel 做爲連接

參考資料：http://stackoverflow.com/questions/20364512/how-do-i-make-entire-bootstrap-panel-as-hyperlink

---

Bootstrap 3.3.4下，glyphicon沒法加載？

本地部署Bootstrap 3.3.4，但 span glyphicon 沒法正常加載。緣由不明，但換作使用CDN加速服務，正常使用。

1 <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">

---

 Bootstrap 2 升級 3

參考資料：從 Bootstrap 2.x 版本升級到 3.0 版本 http://v3.bootcss.com/migration/

　　　　   升級到Bootstrap 3 http://www.berlinix.com/web/uptobs3.php