11.12

1.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>夜晚模式</title>
    <script>
        function mySwitch() {
            var oBody = document.getElementById("mybody");
            var oOnoff = document.getElementById("myonoff");
            if (oOnoff.src.match("bulbon")) {
                oOnoff.src = "http://www.runoob.com/images/pic_bulboff.gif";
                oBody.style.background = "black";
                oBody.style.color = "yellow"
            } else {
                oOnoff.src = "http://www.runoob.com/images/pic_bulbon.gif";
                oBody.style.background = "white";
                oBody.style.color = "black"
            }
        }


    </script>
</head>
<body id="mybody">
<img id="myonoff" onclick="mySwitch()" src="http://www.runoob.com/images/pic_bulbon.gif" width="40px">
<script>
    document.write(Date())
</script>
</body>
</html>

2,html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>base</title>
    <link rel="stylesheet" href="../static/css/13.css" type="text/css">
    <script src="../static/JS/b.js"></script>

</head>
<body id="myBody">
<nav>
    <img id="myOnOff" onclick="mySwitch()"
         src="http://www.runoob.com/images/pic_bulbon.gif" width="50px">
    <a href="http://localhost:63342/denglu1.1/templates/shouye.html?_ijt=qijfc55i74avkg8umf7nn7oqt7">首页</a>
    <a href="http://localhost:63342/denglu1.1/templates/denglu1.1.html?_ijt=7qkhljvviqhhrvp78f6nv1jtqn">谢娜</a>
    <a href="http://localhost:63342/denglu1.1/templates/%E6%B3%A8%E5%86%8C.html?_ijt=bpr6ikepnp2sh7actb82n1m3dt">照片</a>

</nav>
<div class="area">

</div>


    <div class="img">
        <a href="https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=false&word=%E8%B0%A2%E5%A8%9C%E7%85%A7%E7%89%87&hs=2&pn=2&spn=0&di=201792667560&pi=0&rn=1&tn=baiduimagedetail&is=0%2C0&ie=utf-8&oe=utf-8&cl=2&lm=-1&cs=1700013275%2C2707464521&os=212143778%2C3969242451&simid=3030103568%2C3593025267&adpicid=0&lpn=0&ln=30&fr=ala&fm=&sme=&cg=star&bdtype=0&oriquery=%E8%B0%A2%E5%A8%9C%E7%85%A7%E7%89%87&objurl=http%3A%2F%2F08.imgmini.eastday.com%2Fmobile%2F20161229%2F20161229095440_3868fdb5ac69a50dd044a49c734d0dc9_2.jpeg&fromurl=ippr_z2C%24qAzdH3FAzdH3Fooo_z%26e3Bzivx_z%26e3BvvAzdH3FjgpAzdH3Fz5g2ytAzdH3Fda8mAzdH3F8ddlAzdH3Fda989b_z%26e3Bip4s&gsm=0">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1509632960399&di=07fd323383d15c14bba1f93e266bfbe3&imgtype=0&src=http%3A%2F%2F08.imgmini.eastday.com%2Fmobile%2F20161229%2F20161229095440_3868fdb5ac69a50dd044a49c734d0dc9_2.jpeg">
        </a>

<br>
<br>

</body>
</html>

css

.img {
    border: 1px solid #fff9e9;
    width: 300px;
    margin: 5px;
    float: left;

}

div.img img {
    width: 100%;
    height: auto;
}

div.desc {
    text-align: center;
    padding: 10px;
}

div.img:hover {
    border: 1px solid #000000;
}

.area {
    height: 400px;
}


.area1 {
    height: 200px;
}

js

function mySwitch() {
    var oBody = document.getElementById("myBody");
    var oOnoff = document.getElementById("myOnOff");
    if (oOnoff.src.match(4034066)) {
        oOnoff.src = "http://www.runoob.com/images/pic_bulbon.gif";
        oBody.style.background = "black";
        oBody.style.color = "yellow";
    } else {
        oOnoff.src = "http://www.runoob.com/images/pic_bulbon.gif";
        oBody.style.background = "white";
        oBody.style.color = "black";
    }


}

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/wuyishan/p/7774059.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值