zoukankan      html  css  js  c++  java
  • 夜间模式的开启与关闭,父模板的制作

    <!DOCTYPE html>
    <html lang="en"> <head> <meta charset="UTF-8"> <title>img</title> <link rel="stylesheet" type="text/css" href="../static/css/i.css"> </head> <body> <input type="text"> <button>查找</button> <div class="recommend"> <div class="img"> <a href="http://www.gzcc.cn"><img src="http://img.zcool.cn/community/013bea58db839da801219c777e2827.gif"></a> <div class="desc"><a href="http://www.gzcc.cn">校园风光</a></div> </div> <div class="img"> <a href="http://www.gzcc.cn"><img src="http://img.zcool.cn/community/013e3a58db839da801219c7714f34c.gif"></a> <div class="desc"><a href="http://www.gzcc.cn">校友风采</a></div> </div> <div class="img"> <a href="http://www.gzcc.cn"><img src="http://img.zcool.cn/community/0102fd58db839ea801219c774b8624.gif"></a> <div class="desc"><a href="http://www.gzcc.cn">学校文化</a></div> </div> <div class="img"> <a href="http://www.gzcc.cn"><img src="http://img.zcool.cn/community/01701158db839ea801219c77232e16.gif"></a> <div class="desc"><a href="http://www.gzcc.cn">学生风采</a></div> </div> </div> <div class="clearfloat"> <img src="http://img.zcool.cn/community/01ec0058db83a8a801219c77daff8a.gif" > </div> </body> </html>
    夜间模式
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>夜晚模式</title> <script> function mySwich() { var oBody = document.getElementById("myBody"); var oOnoff = document.getElementById("myOnoff"); if (oOnoff.src.match("1509")){ oOnoff.src="https://timgsa.baidu.com/timg?image&quality=80&size=b10000_10000&sec=150"; oBody.style.background="black"; oBody.style.color="green"; }else { oOnoff.src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1509"; oBody.style.background="white"; oBody.style.color="pink"; } } </script> </head> <body id="myBody"> <img id="myOnoff" onclick="mySwich()" src="https://timgsa.baidu.com/timg?image&quality=80&size=b10000_10000&sec=150" width="60px"> <script> document.write(Date()) </script> </body> </html>

      

    复制代码
    img {
         300px;
    }
    
    div .img {
        border: 1px solid #ccc;
         150px;
        float: left;
        margin: 5px;
    
    }
    div.img img {
         100%;
        height: auto;
    }
    
    
    div.desc {
        text-align: center;
        padding: 5px;
    
    }
    
    div.img:hover {
        border: 1px solid #000000;
    }
    
    div.clearfloat {
        clear: both;
    }
  • 相关阅读:
    Visual Studio 2010使用Visual Assist X的方法
    SQL Server 2000 评估版 升级到 SQL Server 2000 零售版
    双网卡多网络单主机同时访问
    开发即过程!立此纪念一个IT新名词的诞生
    delphi dxBarManager1 目录遍历 转为RzCheckTree2树
    5320 软件集合
    delphi tree 从一个表复制到另一个表
    DELPHI 排课系统课表
    长沙金思维 出现在GOOGLE的 金思维 相关搜索里啦!!
    如何在DBGrid的每一行前加一个单选框?
  • 原文地址:https://www.cnblogs.com/iamzhuangyuan/p/7774723.html
Copyright © 2011-2022 走看看