• 超链接A的样式


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>链接样式测试</title>
    <style type="text/css">
    <!--
    /* 全局 */
    body{ line-height:1.5; font-size:14px;}
    a{ color:#2c850d; text-decoration:none;}
    a:link{ color:#2c850d; text-decoration:none;}
    a:visited{ color:#2c850d; text-decoration:none;}
    a:hover{ color:#ff2020; text-decoration:underline;}
    a:actived{ color:#2c850d; text-decoration:none;}
    /* 第一种 */
    .f_red a{ color:#cc0000; text-decoration:none;}
    .f_red a:link{ color:#cc0000; text-decoration:none;}
    .f_red a:visited{ color:#cc0000; text-decoration:none;}
    .f_red a:hover{ color:#ff2020; text-decoration:underline;}
    .f_red a:actived{ color:#cc0000; text-decoration:none;}
    .f_black a{color:#000000; text-decoration:none;}
    .f_black a:link{color:#000000; text-decoration:none;}
    .f_black a:visited{color:#000000; text-decoration:none;}
    .f_black a:hover{color:#999999; text-decoration:underline;}
    .f_black a:actived{color:#000000; text-decoration:none;}
    /* 第二种 */
    a.f_orange{ color:#FF9A00; text-decoration:none;}
    a.f_orange:link{ color:#FF9A00; text-decoration:none;}
    a.f_orange:visited{ color:#FF9A00; text-decoration:none;}
    a.f_orange:hover{ color:#cc0000; text-decoration:underline;}
    a.f_orange:actived{ color:#FF9A00; text-decoration:none;}
    a.f_green{color:#2c850d; text-decoration:none;}
    a.f_green:link{color:#2c850d; text-decoration:none;}
    a.f_green:visited{color:#2c850d; text-decoration:none;}
    a.f_green:hover{color:#999999; text-decoration:underline;}
    a.f_green:actived{color:#2c850d; text-decoration:none;}
    /* 第三种 */
    .f_blue:link{ color:#0000ff; text-decoration:none;}
    .f_blue:visited{ color:#0000ff; text-decoration:none;}
    .f_blue:hover{ color:#ff2020; text-decoration:underline;}
    .f_blue:actived{ color:#0000ff; text-decoration:none;}
    .f_black3:link{color:#000000; text-decoration:none;}
    .f_black3:visited{color:#000000; text-decoration:none;}
    .f_black3:hover{color:#999999; text-decoration:underline;}
    .f_black3:actived{color:#000000; text-decoration:none;}
    /* 第四种 */
    .a f_gray:link{ color:#666666; text-decoration:none;}
    .a f_gray:visited{ color:#66666; text-decoration:none;}
    .a f_gray:hover{ color:#cc0000; text-decoration:underline;}
    .a f_gray:actived{ color:#66666;text-decoration:none;}
    -->
    </style></head>
    <body>
    1.<a href="#">链接样式1</a><br /><br />
    2.<a href="#" class="f_blue">链接样式2</a><br /><br />
    3.<a href="#" class="f_black3 f_blue">链接样式3</a><br />
    3.<a href="#" class="f_blue f_black3">链接样式3_2</a><br /><br />
    4.<span class="f_red"><a href="#" class="f_black3 f_blue">链接样式4</a></span><br /><br />
    5.<span class="f_black"><span class="f_red"><a href="#" class="f_black3 f_blue">链接样式5</a></span></span><br />
    5.<span class="f_red"><span class="f_black"><a href="#" class="f_black3 f_blue">链接样式5_2</a></span></span><br /><br />
    6.<span class="f_red"><span class="f_black"><a href="#" class="f_orange f_blue">链接样式6</a></span></span><br />
    6.<span class="f_red"><span class="f_black"><a href="#" class="f_orange f_green">链接样式6_2</a></span></span><br />
    6.<span class="f_red"><span class="f_black"><a href="#" class="f_green f_orange">链接样式6_3</a></span></span><br />
    </body>
    </html>
  • 相关阅读:
    谈谈MVC项目中的缓存功能设计的相关问题
    MVC 3.0 在各个版本IIS中的部署
    从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件
    从零开始学习jQuery (十) jQueryUI常用功能实战
    从零开始学习jQuery (九) jQuery工具函数
    从零开始学习jQuery (八) 插播:jQuery实施方案
    从零开始学习jQuery (七) jQuery动画-让页面动起来!
    从零开始学习jQuery (六) AJAX快餐
    从零开始学习jQuery (五) 事件与事件对象
    从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
  • 原文地址:https://www.cnblogs.com/amylis_chen/p/2089398.html
Copyright © 2020-2023  润新知