CSS超链接-光标-缩放

浏览数：70 / 时间：2015年06月09日

CSS超链接-光标-缩放

1.CSS 中链接的使用
2.CSS 中光标的使用
3.CSS 中缩放的使用

1、CSS 中链接的使用
超链接伪类属性
a:link 表示该超链接文字尚未被点选
a:visited 表示该超链接文字已被点选过
a:active 表示该超链接文字正被点选,但未被放开
a:hover 表示当鼠标停留在文字上

2、CSS 中光标的使用
属性名称属性值说明
cursor auto 光标是手指
crosshair 光标是十子形
default 光标是箭头
pointer 光标是手形
move 光标是移动的符号
text 输入文字的符号
wait 漏斗
help 帮助

3、CSS 中缩放的使用
属性名称属性值说明
zoom normal 使用对象的实际尺寸

百分数/浮点实数放大缩小

<!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=utf-8" />
<meta name="keyword" content="CSS超链接-光标-缩放"/>
<meta name="description" content="CSS超链接-光标-缩放"/>
<meta name="author" content="xiaobei qq:2801616735"/>
<title>CSS超链接-光标-缩放</title>
<style>
    a:hover{color:red;text-decoration:none;}
    a:visited{color:green;text-decoration:none;}
</style>
</head>

<body>
    <ul>
        <li>超链接</li>
        <li>光标</li>
        <li>缩放</li>
    </ul>
    <h2>1、超链接</h2>
    <p>
        <dl>
            <dt>默认情况:</dt>
            <dd><a href="http://localhost/xhtml/css_link.html">默认情况</a></dd>
            <dt>当鼠标停留在文字上:</dt>
            <dd><a href="http://localhost/xhtml/css_link.html">当鼠标停留在文字上</a></dd>
            <dt>该超链接文字已被点选过:</dt>
            <dd><a href="http://localhost/xhtml/css_link.html">该超链接文字已被点选过</a></dd>
        </dl>
    </p>
    <hr/>
    <h2>2、光标</h2>
    <p>
        <dl>
            <dt>默认情况</dt>
            <dd><span>默认情况</span></dd>
            <dt>箭头</dt>
            <dd><span style="cursor:default;">箭头</span></dd>
            <dt>手形</dt>
            <dd><span style="cursor:pointer;">手形</span></dd>
            <dt>帮助</dt>
            <dd><span style="cursor:help;">帮助</span></dd>
        </dl>
    </p>
    <hr/>
    <h2>3、缩放</h2>
    <p style="width:100px;height:100px; background-color:red; zoom:0.5;">缩放</p>
</body>
</html>