Tip: you can modify some code before running
Simple css navigation menu<BODY><LINK REL="stylesheet" TYPE="text/css" HREF="style.css"><div><ul><li id="td1"></li><li id="td2"></li><li id="td3"></li><li id="td4"></li><li id="td5"></li><li id="td6"></li><li id="td7"></li><li id="td8"></li></ul></div><style>* {padding: 0 margin: 0;}ul {list-style-type: none;}#td1 {float:left;width: 112px;height: 37px;background: url(/demo/pic/head_1.jpg) no-repeat;}#td2 {float:left;width: 109px;height: 37px;background: url(/demo/pic/head_2.jpg) no-repeat;}#td3 {float:left;width: 115px;height: 37px;background: url(/demo/pic/head_3.jpg) no-repeat;}#td4 {float:left;width: 110px;height: 37px;background: url(/demo/pic/head_4.jpg) no-repeat;}#td5 {float:left;width: 112px;height: 37px;background: url(/demo/pic/head_5.jpg) no-repeat;}#td6 {float:left;width: 115px;height: 37px;background: url(/demo/pic/head_6.jpg) no-repeat;}#td7 {float:left;width: 117px;height: 37px;background: url(/demo/pic/head_7.jpg) no-repeat;}#td8 {float:left;width: 129px;height: 37px;background: url(/demo/pic/head_8.jpg) no-repeat;}#td1:hover {float:left;width: 112px;height: 37px;background: url(/demo/pic/head01_1.jpg) no-repeat;}#td2:hover {float:left;width: 109px;height: 37px;background: url(/demo/pic/head01_2.jpg) no-repeat;}#td3:hover {float:left;width: 115px;height: 37px;background: url(/demo/pic/head01_3.jpg) no-repeat;}#td4:hover {float:left;width: 110px;height: 37px;background: url(/demo/pic/head01_4.jpg) no-repeat;}#td5:hover {float:left;width: 112px;height: 37px;background: url(/demo/pic/head01_5.jpg) no-repeat;}#td6:hover {float:left;width: 115px;height: 37px;background: url(/demo/pic/head01_6.jpg) no-repeat;}#td7:hover {float:left;width: 117px;height: 37px;background: url(/demo/pic/head01_7.jpg) no-repeat;}#td8:hover {float:left;width: 129px;height: 37px;background: url(/demo/pic/head01_8.jpg) no-repeat;}</style></bODY>
Tip: you can modify some code before running
