zoukankan      html  css  js  c++  java
  • 18 章 CSS 链接、光标、 DHTML 、缩放

    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>
    

     

    柳志军:13418977808(手机微信),QQ:93684042
  • 相关阅读:
    Unity Camera属性
    多摄像机同时协作运行
    《未来简史》读书笔记
    Binder学习笔记(十二)—— binder_transaction(...)都干了什么?
    Binder学习笔记(十一)—— 智能指针
    binder学习笔记(十)—— 穿越到驱动层
    Binder学习笔记(九)—— 服务端如何响应Test()请求 ?
    Binder学习笔记(八)—— 客户端如何组织Test()请求 ?
    使用hexo搭建博客并上传GitHub
    Binder学习笔记(七)—— ServiceManager如何响应addService请求
  • 原文地址:https://www.cnblogs.com/liu-zhijun/p/10628316.html
Copyright © 2011-2022 走看看