CSS Styles
Copy Code code as follows:
. Remind span {display:block;margin-top:-22px}
. remind a:hover {padding-top:22px;}
. Remind a {Float:left;overflow:hidden;}
. remind{height:22px;line-height:22px;overflow:hidden;padding-left:10px;}
HTML code
Copy Code code as follows:
<div class= "remind" ><a href= "#" ><span> if you need to modify the account number, please send the revised information and related certificates to the mailbox </span> prompt </a></div >
Concrete examples
<! 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=gb2312 "/> <title> mouse via transformed text </title> <style> #Menu {width:500px; margin:50px Auto; border:1px solid #CCC; Overflow:hidden; } #Menu ul {margin:0; padding:0; List-style:none; } #Menu li {width:100px; height:22px; line-height:22px; Float:left; Overflow:hidden; Text-align:center; } #Menu a {width:100px; Float:left; Overflow:hidden; #Menu span {display:block; margin-top:-22px; } #Menu a:hover {padding-top:22px} </style> </pead> <body> <ul id= "menu" > <li><span >HOME</span> Home </li> <li><span>NEWS</span> News </li> <li><span> About</span> about </li> <li><span>CONTACT</span> contact </li> <li><span> photo </span>PHOTO</li> </ul> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
