The simple left-side navigation code is as follows:
<! Doctype HTML>
CSS:
/** Small margin Web site: http://xtian.me time: 2013-11 *** // ** clean margins **/body, H1, H2, H3, H4, H5, H6, HR, p, BLOCKQUOTE, DL, DT, DD, UL, ol, Li, pre, form, fieldset, legend, button, input, textarea, Th, TD {margin: 0px; padding: 0px;}/** default font **/body, button, input, select, textarea {Font: 12px/1.5, Arial, sans-serif;} H1, H2, h3, H4, H5, H6 {font-size: 100%;} address, cite, dfn, em, VAR {font-style: normal;} code, KBD, pre, SAMP {font-family: Courier New, courier, Monospace;} small {font-size: 12px;} ul, ol, Li {list-style: none;} A {text-Decoration: none;}: hvoer {text-Decoration: underline;} sup {vertical-align: Text-top ;}sub {vertical-align: Text-bottom;} legend {color: #000 ;} fieldset, IMG {border: 0px;} button, input, select, textarea {font-size: 100%;} table {border-collapse: collapse; border-Spacing: 0 ;} /** reset **/. invisible {visibility: hidden ;}. nobg {Ba Ckground: none! Important ;}. clear {display: block; Height: 0; overflow: hidden; clear: Both ;}. clearfix: After {content: '\ 20'; display: block; Height: 0; clear: Both ;}. clearfix {* ZOOM: 1;}/** page style **/. hidden {display: none ;}. wmenu DT ,. wmenu dt ,. wmenu dd A: hover,. currcent {Background: URL (.. /images/w_base_z.png) No-Repeat ;}. wmenu {Height: 500px; width: pixel PX; Border: 1px solid # d1d1d1; Background: # f3f3f3 ;}. wmenu DL {Bor Der-bottom: 1px solid # d1d1d1 ;}. wmenu dt {Height: 41px; line-Height: 41px; border-bottom: 1px solid # d1d1d1; text-align: Left; Background-position: 153px-56px ;}. wmenu dt a {display: block; padding-left: 48px; font-size: 16px; color: #444343 ;}. wmenu DT. user A {background-position: 18px-22px ;}. wmenu DT. edit a {background-position: 18px 12px ;}. icotop {border: none! Important; Background-position: 153px-90px! Important ;}. wmenu dd {Line-Height: 37px ;}. wmenu dd A {display: block; padding-left: 50px; font-size: 14px; color: #362c30 ;}. wmenu dd A: hover,. currcent {display: block; padding-left: 50px; color: # fff! Important; Background-repeat: Repeat-X; Background-position: Left Bottom ;}
If you want to see the overall effect, go to my blog and check that the address is www. xtian. Me.