Button effect implemented by a CSS Image
<Style>. inp_L1 ,. inp_L2, {background: url (http://www.jb51.net/images/bg_x.jpg) no-repeat }. inp_L1 {width: 67px; height: 23px; background-position:-4px-4px; border: 0; color: #464646; line-height: 23px }. inp_L2 {width: 67px; height: 23px; background-position:-4px-30px; border: 0; color: #464646; line-height: 23px} </style> <input type = "submit" value = "login" class = "inp_L1" onMouseOver = "this. className = 'indium _ l2' "onMouseOut =" this. className = 'indium _ l1' "id =" input_btn1 "name =" enter. x "tabindex =" 4 ">
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
<Head> <meta http-equiv = "Content-Type" content = "text/html; charset = gb2312 "/> <title> A navigation bar completed with a CSS image </title> <style> ul, li {list-style: none; float: left ;} body {font-size: 12px; line-height: 1.6; font-family: Verdana, "", Arial; text-align: center ;} # info li {margin-left: 4px; margin-top: 15px; }# info a {display: block; text-align: center; padding-left: 15px; padding-top: 2px; padding-bottom: 1px; background-image: url ( http://www.jb51.net/images/bg-2.GIF ); Background-repeat: no-repeat; color: #000; width: 47px; cursor: hand; text-decoration: none;} # job a: link, # job: visited {background-position:-62px 0px;} # eve a: link, # eve a: visited {background-position:-124px 0px;} # oth a: link, # oth a: visited {background-position:-186px 0px;} # car a: hover, # car a: active {background-position: 0px-22px; color: # fff ;}# job a: hover, # car a: active {background-position:-62px-22px; color: # fff ;}# eve a: hover, # car a: active {background-position:-124px-22px; color: # fff ;}# oth a: hover, # car a: active {background-position: -186px-22px; color: # fff ;} </style> </pead> <body> <p id = "info"> <ul> <li id = "car"> game play </li> <li id = "job"> entertainment tickets </li> <li id = "eve"> </li> <li id = "oth"> good fun </li> </ ul> </p> </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]