码迷,mamicode.com
首页 > Web开发 > 详细

18 章 CSS 链接、光标、 DHTML 、缩放

时间:2019-03-30 18:35:16      阅读:193      评论:0      收藏:0      [点我收藏+]

标签:public   none   html   文档   文件   link   href   highlight   XML   

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>

 

 

18 章 CSS 链接、光标、 DHTML 、缩放

标签:public   none   html   文档   文件   link   href   highlight   XML   

原文地址:https://www.cnblogs.com/liu-zhijun/p/10628316.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!