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>