当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 用CSS实现链接的虚线下划线效果

CSS样式表
理解(X)HTML的文档结构
CSS教程:理解继承属性及应用
CSS网页布局:关于定位(position)
CSS简单实现网页悬浮效果(对联广告)
CSS教程:行高line-height属性(1)
CSS Sprite图片处理技巧
CSS教程:最基本的条状图表
CSS教程:复合型条状图表
网页布局 CSS简单实现垂直居中
CSS网页实例:斜角滑动门导航条
CSS教程:专门介绍滑动门
网页文字应用CSS的一些技巧
IE7与web标准设计(1)
IE7与web标准设计(2)
网页的中英文字体对齐问题的解决
IE7与web标准设计(3)
CSS教程:网页英文字体和中文字体应用
css教程:css和document
CSS规则的结构和Grouping、class和id
CSS解决浏览器的等宽空格问题

CSS样式表 中的 用CSS实现链接的虚线下划线效果


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 225 ::
收藏到网摘: n/a

一些CSS定义虚线实例代码 修改您的样式表,找下边这段(一般都在开头)
a {
color:#3399FF;
font-weight:Normal; /*字体效果 普通 可以改成bold粗体*/
text-decoration:none; /*下划线效果:无下划线*/
}
a:hover {
color:#4499EE;
text-decoration:none; /*下划线效果:无下划线*/
border-bottom: 1px #0099CC dotted /*加一个只有下边的框 边框为虚线*/
}
   a{}控制连接的效果 a:hover{}控制鼠标移上去的效果。
一些CSS定义虚线实例代码
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]