去年純用div盒模型和偽類做的tap選項選單系列，
當然編碼規範上不夠完整，比較冗餘，用以收藏借鑑。
lang="en">
charset="utf-8">
div盒模型練習title>
type="text/css">
body
h1.b2
.menu
.menu
ul .menu
ulli
.menu
ulli
a,.menu
ulli
a:visited
.menu
ulli
ul .menu
ulli
:hover
a .menu
ulli
:hover
ul .menu
ulli
:hover
ulli
a .menu
ulli
:hover
ulli
a:hover
style>
head>
class="b1">
about meh1>
div>
class="b2">
class="menu">
href="">故事背景a>
href="./aa.html">出生梅州a>
li>
href="./aa.html">深圳長大a>
li>
ul>
li>
href="">求學經歷a>
href="./aa.html">珠光小學a>
li>
href="./aa.html">龍珠中學a>
li>
href="./aa.html">深圳中學a>
li>
href="./aa.html">深圳大學a>
li>
ul>
li>
href="">工作經驗a>
href="./aa.html">中興實習a>
li>
href="./aa.html">軟體開發a>
li>
href="./aa.html">總裁助理a>
li>
href="./aa.html">php課程學習a>
li>
ul>
li>
href="">興趣愛好a>
href="./aa.html">籃球a>
li>
href="./aa.html">戶外a>
li>
href="./aa.html">健身a>
li>
href="./aa.html">旅行a>
li>
ul>
li>
href="">情感歷史a>
href="./aa.html">懵懵懂懂a>
li>
href="./aa.html">傷心往事a>
li>
ul>
li>
href="">未來展望a>
href="./aa.html">腳踏實地a>
li>
href="./aa.html">但求無悔a>
li>
ul>
li>
ul>
div>
div>
id="b4" >
class="b5">
div>
class="b6">
div>
class="b7">
div>
class="b8">
div>
class="b9">
div>
class="b10">
div>
class="b11">
div>
class="b12">
div>
div>
class="b13">
div>
body>
html>
盒模型中的div居中
說到居中的問題，或許大多數童鞋都會想到text align center margin 0 auto vertical align middle line height height 的確，這些屬性在某種程式上可以達到居中的效果。但是否是適用於每一種情況呢？我們先來溫習一下這些個屬性值的用處。tex...
標準盒模型和IE盒模型
盒子模型是css中乙個重要的概念，理解了盒子模型才能更好的排版。其實盒子模型有兩種，分別是ie 盒子模型和標準 w3c 盒子模型。他們對盒子模型的解釋各不相同，先來看看我們熟知的標準盒子模型 從上圖可以看到標準w3c 盒子模型的範圍包括 margin border padding content，並...
正常盒模型和怪異盒模型
首先大概說說正常盒模型和怪異盒模型的區別 1.用途 正常盒模型主要用於pc端，怪異盒模型主要用於手機端。2.原理 正常盒模型的大小是由內到外的，由內部決定外部的大小 而怪異盒模型是由外而內的。舉例說明 以下為正常盒模型，設定兩個div，分別為鞋盒和鞋子 鞋子 鞋子 設定樣式如下 body div c...