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

CSS超链接-光标-缩放

时间:2014-11-05 00:16:13      阅读:324      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   http   io   color   ar   os   使用   

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>

 

CSS超链接-光标-缩放

标签:des   style   blog   http   io   color   ar   os   使用   

原文地址:http://www.cnblogs.com/2801616735kzw/p/4075149.html

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