左側導航欄實作
主要運用html和css代碼實作：
html代碼：
= //label與input綁定 css代碼： #wrap{ margin-left:0px; padding:0px 0px 0px 0px; transition:0.25s ease-out; -webkit-transition:0.25s ease-out; } #wrap > label{ display:inline-block; } #wrap > label{ float:left; background:#005e99; border-radius:50px; color: #FFF; cursor: pointer; display: block; font-family: Courier New; font-size: 25px; font-weight: bold; width: 30px; height: 30px; line-height: 35px; text-align: center; text-shadow: 0 -4px; } #wrap > label:hover{ background:#000; } #sideToggle{ display: none; } #sideToggle:checked + aside{ left:0; } #sideToggle:checked ~ #wrap{ padding-left: 225px; } aside{ position:absolute; top:60px; left:-225px; background:#005e99; transition:0.2s ease-out; -webkit-transition:0.2s ease-out; z-index:100; }