设为首页 加入收藏高级搜索·你问我答 知识就像内裤,看不见但很重要!~
入门新手学电脑认识硬件术语
教程视频教程笔记本教程图像
系统BIOS设置安装优化配置
故障不开机死机蓝屏变慢断网
安全查木马防火墙局域网防护
XPWin7Win8Vista2003linux
选购组装DIY笔记本台式机健康
网络组网无线英特网网络维护
软件QQ聊天WordExcel其他软件
资讯热门美女游戏电影
问答硬件软件网络数码
下载必备办公桌面主题
当前位置:学电脑网 -> 电脑教程 -> 网页设计教程 -> CSS教程 > 正文

CSS样式表代码布局基础教程—课程9:链接样式

2011-10-23 00:04:07作者: 浏览:1320我要评论(0)
字号:T|T

九、链接样式

 使用伪类可以设置链接的样式,比如改变颜色、去掉下划线等,下面我们来看一个练习;

 1、文本编辑器

 1)打开记事本或 gedit、leafpad 文本编辑器,gedit 在查看菜单里选择“HTML”;

 2)点菜单“文件-打开”命令,打开自己文件夹里的 lx7.html

 3)再点菜单“文件-另存为”命令,保存文件名为 “lx9.html

 2、设置伪类

 1)在 head 区内,输入内部样式表,设定各个 <a> 的锚标记样式,如下;

<style type="text/css">
<!--
a {
  display:block; width: 50px; background:#90ee90;
}
a:link {
  color:#0066cc;text-decoration:none;
}
a:visited {
  color:#800000;text-decoration:none;
}
a:active {
  color:green;text-decoration:none;
}
a:hover {
  color:red;text-decoration:underline; background:yellow;
}
-->
</style>

 2)第一个 a 设定全局锚点的样式,用块显示、宽度是50像素、背景色是浅绿色,接下来是锚点 a 的成员

 link 是链接,设定页面中的链接样式,颜色蓝色,不带下划线,

 visted 是访问过的链接,设定样式为栗色、不带下划线,

 active 是按下鼠标时的链接,设定颜色为绿色、无下划线,

 hover 是鼠标移过来悬停,设定颜色为红色、有下划线,背景色改成黄色,hover 放在其他几个成员的后面;

 a1nr.gif

 3)保存一下文件,回到自己的文件夹中,打开 lx9 网页,试着用鼠标点击、拖动链接,看一下效果;

 a2llq.gif

 本节学习了设置链接样式的基本方法,如果你成功地完成了练习,请继续学习下一课内容;

热点图文

      表  情:
      验 证 码:
      请文明发言,署名或者登录评论!(署名需要验证码)
      太原|大连|鸡西|焦作|襄樊|荆州|泉州|九江|漯河|岳阳|常德|永州|宝鸡|金华|玉溪|榆林|定州|冀州|永济|桦甸|大安|昆山|如皋|宣州|滕州|莱州|兖州|乳山|当阳|松滋|醴陵|乐昌|鹤山|陆丰|连州|广西东兴|广西凭祥|琼山|文昌|什邡|雅安|酒泉|新疆阿图什|新疆喀什|