Very simple navigation bar, placed here has been convenient for later use;
Ie7/ie7/firefox have been tested; no problem;
Copy CodeThe code is as follows:
*{padding:0; margin:0; font-size:12px; line-height:1.7; Font-family:verdana, "Song Body", Arial; list-style:none;}
/* Simply define the global */
A:link,a:visited{background: #FFF3C6 url (jaian.gif) no-repeat 15px 7px; padding-left:23px; color: #000000; Text-decoration:none;}
A:hover,a:active{color: #000; Text-decoration:none;background-color: #FED762;}
a{display:block;border-bottom:1px solid #fff; padding-left:10px; width:127px;}
/* Define the style of the link */
ul{background: #fff; width:150px; border:1px solid #FF6600; margin:0px 20px-1px 20px; padding:1px;}
/* Defines the ul*/
span{display:block;background: #FF9900 url (jai.gif) no-repeat 5px 5px; padding-left:13px;}
Copy CodeThe code is as follows:
website Home
- My log
- Leave a message for me
- Emotional articles
website Home
- My log
- Leave a message for me
- Emotional articles
website Home
- My log
- Leave a message for me
- Emotional articles
Effects Page
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; Charset=utf-8 "/> <title>www.zishu.cn</title> <style> *{padding:0; margin:0; font-size:12px; line-height:1.7; Font-family:verdana, "Song Body", Arial; List-style:none;} /* Simple definition of global */a:link,a:visited{background: #FFF3C6 URL (jaian.gif) no-repeat 15px 7px; padding-left:23px; color: #000000 ; text-decoration:none;} A:hover,a:active{color: #000; Text-decoration:none;background-color: #FED762;} a{display:block;border-bottom:1px Solid #fff; padding-left:10px; width:127px; }/* Defines the style of the link */ul{background: #fff; width:150px; border:1px solid #FF6600; margin:0px 20px-1px 20px; padding:1px;}/* defines UL */span{display:block;background: #FF9900 url (jai.gif) no-repeat 5px 5px; padding-left:13px;} </style> </pead& Gt <body> <ul><span> Home </span> <li> my blog </li> <li> give me a message </li> <li> emotional articles </li> </ul > <ul><span> Home </span> <li> my blog </li> <li> give me a message </li> <li> emotional articles </li> </ul> <ul><span> Home </span> <li> my blog </li> <li> give me a message </li > <li> sentiment articles </li> </ul> </body> </ptml>
[Ctrl + A full selection Note: If you need to introduce external JS need to refresh to execute]
