zoukankan      html  css  js  c++  java
  • 鼠标移入/移出改变样式

    <!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" />
    <title>鼠标移入/移出改变样式</title>
    <style>
    body{color:#fff;font:12px/1.5 Tahoma;}
    #div1{150px;height:150px;margin:0 auto;padding:10px;background:black;border:10px solid #000;cursor:crosshair;}
    #div1.hover{color:red;background:#f0f0f0;border:10px solid red;}
    </style>
    <script>
    window.onload = function ()
    {
        var oDiv = document.getElementById("div1");
        oDiv.onmouseover = function ()
        {
            oDiv.className = "hover"
        };
        oDiv.onmouseout = function ()
        {
            oDiv.className = ""    
        }
    };
    </script>
    </head>
    <body>
    <div id="div1">鼠标移入改变样式,鼠标移出恢复。</div>
    </body>
    </html>
  • 相关阅读:
    三数之和
    167
    二分搜索树
    687
    索引堆
    二分查找 leetcode704
    leetcode 56合并区间 java
    leetcode 1046
    堆的数据结构java
    leetcode 493
  • 原文地址:https://www.cnblogs.com/mayufo/p/4474928.html
Copyright © 2011-2022 走看看