<Html> <pead> <title> CSS creates a colorful text link </title> <meta http-equiv = "Content-Type" content = "text/html; charset = gb2312 "> <style type =" text/css "> td {font-size: 12px; font-family: ;} a {font-family:" "; font-size: 9pt; text-decoration: none }. t1 {color: # CC0000; text-decoration: underline }. t2 {text-decoration: none; color: #006699 ;}. t3 {color: #006600; text-decoration: underline overline }. t4 {color: # 0066FF; text-decoration: line-through }. t5 {border: 1px # FF0000 solid; height: 20px; color: #000099 }. t6 {border: # FF0000 solid; height: 0px; color: # 0066FF; border-width: 0px 0px 1px }. t7 {border: # FF0000 solid; height: 0px; color: # 0066FF; border-width: 0px 0px 1px; padding-bottom: 5px }. t8 {border: # FF0000 solid; height: 0px; color: # 0066FF; border-width: 0px 0px 1px; width: 200px; text-align: center }. t9 {border: # FF0000 double; height: 0px; color: # 0066FF; border-width: 0px 0px 3px }. t10 {border: 1px # FFFF00 solid; color: # FFFF00; clip: height; background-color: #990000; height: 20px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; width: 130px: 0px }. t11 {PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px; background-color: # D9DEE8; height: 25px; width: 150px; text-align: center; border: # D9DEE8; border-style: outset; border-top-width: 2px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 2px }. t12 {text-decoration: none; color: #006699; height: 25px; width: 130px; padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 4px; border: 1px # 0000CC solid; filter: Blur (Add = 1, Direction = 45, Strength = 2); text-align: center }. t13 {color: # FFFF00; text-decoration: none; height: 25px; width: 120px; font-family: ""; font-size: 12px; background-image: url (http://www.webjx.com/htmldata/2005-12-12/bk3.gif); padding-top: 6px; padding-left: 5px; text-align: center }. t13: hover {color: # FFFFFF; text-decoration: none; background-image: url (http://www.webjx.com/htmldata/2005-12-12/bk4.gif); height: 25px; width: 120px; padding-top: 6px; padding-left: 5px; text-align: center }. t14 {color: # FFFF00; text-decoration: none; height: 25px; width: 120px; font-family: ""; font-size: 12px; background-image: url (http://www.webjx.com/htmldata/2005-12-12/bk1.gif); padding-top: 5px; padding-left: 5px }. t14: hover {color: #000000; text-decoration: none; background-image: url (http://www.webjx.com/htmldata/2005-12-12/bk2.gif); height: 25px; width: 120px; padding-top: 5px; padding-left: 5px }. t1: hover {color: # 0000FF; text-decoration: underline }. t2: hover {text-decoration: underline; color: #339900 ;}. t3: hover {color: # 9900CC; text-decoration: none }. t4: hover {color: # FF0099; text-decoration: none }. t5: hover {border: 1px # 0000FF solid; height: 20px; color: # CCCC00 }. t6: hover {border: solid; height: 0px; color: # 0066FF; border-width: 0px 0px 1px; border-color: #00FF00 #00FF00 #00FF33 #00FF33 }. t7: hover {border: # FF0000 solid; height: 0px; color: #990000; border-width: 0px 0px 1px; padding-bottom: 2px }. t8: hover {border: # FF0000 solid; height: 0px; color: #336600; border-width: 0px 0px 1px; width: 170px; text-align: center }. t9: hover {border: # FF0000 double; height: 0px; color: # 0066FF; border-width: 0px 0px 5px }. t10: hover {border: 1px # 0000FF solid; color: #333333; clip: height; background-color: # C8D8F0; height: 20px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; width: 130px: 0px }. t11: hover {BORDER-RIGHT: #99 CCFF 1px outset; PADDING-RIGHT: 2px; BORDER-TOP: #99 CCFF 1px outset; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; BORDER-LEFT: #99 CCFF 1px outset; PADDING-TOP: 2px; BORDER-BOTTOM: #99 CCFF 1px outset; background-color: # C8D8F0; height: 25px; width: 150px; text-align: center ;}. t12: hover {text-decoration: none; color: #006699; height: 25px; width: 130px; padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 4px; border: 1px # 0000CC solid; filter: Blur (Add = 1, Direction = 45, Strength = 1); text-align: center }. txt10 {line-height: 15px }</style> </pead> <body bgcolor = "# EBEAF4" text = "#000000" onLoad = "MM_preloadImages('bk4.gif','bk3.gif','bk2.gif','bk1.gif ') "> <table width =" 300 "border =" 0 "cellspacing =" 1 "cellpadding =" 5 "align =" center "bgcolor =" # cccccccc "> <tr bgcolor = "# FFFFFF" align = "center"> <td colspan = "2" class = "txt10"> CSS creates colorful text links </td> </tr> <tr bgcolor = "# CCCCCC"> <td> 1. </td> <td> primary link style </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 1. </td> <td> normal link </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 2. </td> <td> underline-free link </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 3. </td> <td> double-line link </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 4. </td> <td> strikethrough link </td> </tr> <tr bgcolor = "# CCCCCC "> <td> 2. </td> <td> advanced link style </td> </tr> <tr bgcolor =" # FFFFFF "> <td> 1, </td> <td> principle of alternative underline </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 2. </td> <td> Custom underline colors </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 3. </td> <td> Custom underline distance </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 4. </td> <td> Custom underline length and alignment </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 5. </td> <td> Custom Double underline </td> </tr> <tr bgcolor = "# cccccccc"> <td> 3. </td> <td> advanced link style </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 1. </ td> <td> define block link </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 2. </td> <td> define button style </td> </tr> <tr bgcolor = "# FFFFFF"> <td> 3. </td> <td> define a special effect link </td>/ tr> <tr bgcolor = "# FFFFFF"> <td> 4. </td> <td> static background switching link </td> </tr> <tr bgcolor =" # FFFFFF "> <td> 5. </td> <td> dynamic background switching link </td> </tr> <tr bgcolor =" # FFFFFF "align =" right "> <td colspan =" 2 "> webpage learning network adaptation </td> </tr> </table> <p class =" t2 "> </p> </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]