18 章 CSS 链接、光标、 DHTML 、缩放
程序员文章站
2024-01-20 13:23:04
1.CSS 中链接的使用 2.CSS 中光标的使用 3.CSS 中 DHTML 的使用 4.CSS 中缩放的使用 1 18 8. .1 1 S CSS 中 链接的使用 超链接伪类属性 a:link 表示该超链接文字尚未被点选 a:visited 表示该超链接文字已被点选过 a:active 表示该超 ......
1.css 中链接的使用
2.css 中光标的使用
3.css 中 dhtml 的使用
4.css 中缩放的使用
1 18 8. .1 1 s css 中 链接的使用
超链接伪类属性
a:link 表示该超链接文字尚未被点选
a:visited 表示该超链接文字已被点选过
a:active 表示该超链接文字正被点选,但未被放开
a:hover 表示当鼠标停留在文字上
1 18 8. .2 2 s css 中 光标的使用
属性名称 属性值 说明
cursor auto 光标是默认
crosshair 光标是十子形
default 光标是箭头
hand/pointer 光标是手形
move 光标是移动的符号
text 输入文字的符号
wait 漏斗
help 帮助
1 18 8. .2 2 s css 中 l dhtml 的使用
属性名称 属性值 说明
behavior url dhtml 文件
3 18.3 s css 中缩放的使用
属性名称 属性值 说明
zoom normal 使用对象的实际尺寸
百分数/浮点实数 放大缩小
11css链接
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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">
a{
color: red;
text-decoration: none;
background: green;
border: 1px dashed black;
}
</style>
</head>
<body>
<a href="http://www.baidu.com">我是超级链接加边框去掉下划线</a>
</body>
</html>
12css链接
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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">
a:link{
color: red;
text-decoration: none;
}
a：visited{
color: red;
text-decoration: none;
}
a:hover{
color: blue;
text-decoration: underline;
}
</style>
</head>
<body>
<a href="http://www.baidu.com">我是超级链接伪类的鼠标放上去就会加下划线和变色</a>
</body>
</html>
13css链接
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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">
a:{
color: red;
text-decoration: none;
}
a:hover{
color: blue;
text-decoration: underline;
}
</style>
</head>
<body>
<a href="http://www.baidu.com">我是超级链接伪类的鼠标放上去就会加下划线和变色</a>
</body>
</html>
21css光标的使用鼠标放上去箭头变成手型
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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">
div{
cursor: pointer;
}
</style>
</head>
<body>
<div>我是鼠标放上去箭头变成手型</div>
</body>
</html>
22css光标的使用鼠标放上去箭头变成图标
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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">
span{
cursor:url("images/860402.ani");
}
</style>
</head>
<body>
<span>我是鼠标放上去箭头变成图标</span>
</body>
</html>
上一篇： 异步上传图片并且图片回显到页面的解决方案