好贷网好贷款

CSS 鼠标响应事件,鼠标经过CSS,鼠标移动CSS,鼠标点击CSS

发布时间:2016-12-5 10:29:33 编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"CSS 鼠标响应事件,鼠标经过CSS,鼠标移动CSS,鼠标点击CSS",主要涉及到CSS 鼠标响应事件,鼠标经过CSS,鼠标移动CSS,鼠标点击CSS方面的内容,对于CSS 鼠标响应事件,鼠标经过CSS,鼠标移动CSS,鼠标点击CSS感兴趣的同学可以参考一下。

几种鼠标触发CSS事件。   说明: onMouseDown 按下鼠标时触发  onMouseOver 鼠标经过时触发  onMouseUp 按下鼠标松开鼠标时触发  onMouseOut 鼠标移出时触发  onMouseMove 鼠标移动时触    <html> <head> <title>CSS 鼠标响应事件</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style type="text/css"> .Off{ background-color: #00FF66; padding:100px;} .up{background-color: #FF0000; padding:100px} </style> </head>   <body> <ul class=Off onMouseOut="this.className='Off'" onMouseOver="this.className='Up'">  <h4>鼠标响应事件 当鼠标经过移出时切换css</h4> <li>onMouseDown 按下鼠标时触发  <li>onMouseOver 鼠标经过时触发  <li>onMouseUp 按下鼠标松开鼠标时触发  <li>onMouseOut 鼠标移出时触发  <li>onMouseMove 鼠标移动时触发 </li> </ul> </body> </html> <span style="color: red;">鼠标经过表格变色样式:<br></span> ? <style>     table   {   background-color:#000000;   cursor:hand;   width:100%;   }     td   {     /*设置onmouseover事件*/     onmouseover:   expression(onmouseover=function   (){this.style.borderColor   ='blue';this.style.color='red';this.style.backgroundColor   ='yellow'});    /*设置onmouseout事件*/     onmouseout:   expression(onmouseout=function   (){this.style.borderColor='';this.style.color='';this.style.backgroundColor   =''});     background-color:#ffffff;     }     </style> 控制表格隔行变色:     简单应用:         <style type="text/css"> <!-- tr {background-color:expression((this.sectionRowIndex%2==0)?"#E1F1F1":"#F0F0F0")} -->     高级应用:每个单元格变色         <style type="text/css"> <!-- tr {background-color:expression((this.sectionRowIndex%2==0)?"red":"blue")} td {background-color:expression((this.cellIndex%2==0)?"":((this.parentElement.sectionRowIndex%2==0)?"green":"yellow"))} --> </style> 添加CSS文件引用: <link id="cssStyle" rel="stylesheet" type="text/css" href="../style.css" />

上一篇:用Delphi实现程序检测计算机是否连网
下一篇:举个例子解释下什么是线程不安全?

相关文章

相关评论