标签：script des 函数 image 搜索 box 分享 type 个人
<!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="white"; }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="50px";> <script> document.write(Date()) </script> </body>
basehtml
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>img</title>
<link rel="stylesheet" type="text/css" href="base.css">
<script src="base.js"></script>
<base href="http://i1.sinaimg.cn/dy/weather/main/index14/007/icons_32_yl/"target="_blank">
</head>
<body id="myBody">
<div class="clearfloat">
<nav >
<img src="w_02_08_00.png" >
<a href="http://www.gzcc.cn/">首页</a>
<a href="">下载</a>
<a href="">音乐</a>
<a href="">电影</a>
<input type="text" name="search">
<button type="submit">搜索</button>
<a href="{{ url_for(‘login‘) }}">登录</a>
<a href="{{ url_for(‘zhuce‘) }}">注册</a>
<a href="" >加入我们</a>
<img id="myOnOff" onclick="mySwitch()" src="http://www.runoob.com/images/pic_bulbon.gif" width="20px";>
</nav><hr>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
<div id="footer" style="background-color: lightskyblue;clear: both;text-align: center;"></div>
<div class="desc" >
<hr>
<div class="img" >
<a href="http://www.gzcc.cn/">
<img src="http://img1.imgtn.bdimg.com/it/u=1137883556,1724295533&fm=200&gp=0.jpg" width="20px">
</a>
<div><a href="http://www.gzcc.cn/">校园风光</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn/">
<img src="http://img5.imgtn.bdimg.com/it/u=3778875510,3433017087&fm=200&gp=0.jpg"></a>
<div><a href="http://www.gzcc.cn/">精彩时刻</a></div>
</div>
<div class="img" class="clearfloat" class="img-hover">
<a href="http://www.gzcc.cn/">
<img src="http://img0.imgtn.bdimg.com/it/u=2035935358,1694862404&fm=200&gp=0.jpg"></a>
<div><a href="http://www.gzcc.cn/">双十一</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn/">
<img src="http://img0.imgtn.bdimg.com/it/u=1822961415,409605297&fm=200&gp=0.jpg"></a>
<div><a href="http://www.gzcc.cn/">aasdas</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn/">
<img src="http://img4.imgtn.bdimg.com/it/u=4201211113,1653247897&fm=200&gp=0.jpg"></a>
<div><a href="http://www.gzcc.cn/">dasdads</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn/">
<img src="http://img5.imgtn.bdimg.com/it/u=1203035184,1555274189&fm=200&gp=0.jpg"></a>
<div><a href="http://www.gzcc.cn/">dasdsadsad</a></div>
</div>
</div>
</body>
<footer>
<div class="footer_box">
Copyright@ 2015-2019 个人版权，版权所有 作者：dadadrrr
</div>
</footer>
</html>
base.js
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="white"; }else { oOnoff.src="http://www.runoob.com/images/pic_bulbon.gif"; oBody.style.background="white"; oBody.style.color="black"; } }
base.css
img{
width: 20px;
}
div .img{
width: 250px;
border: 1px solid #eeeeee;
float: left;
margin: 15px;
}
div.img img{
width: 100%;
height: auto;
}
div.desc{
text-align: center;
padding: 15px;
}
div.img:hover{
border: 1px solid #222222;
}
.clearfloat{
clear: both;
}
footer{
position: fixed;
bottom:0;
width:100%;
}
footer .footer_box{
background-color: #002D98;
padding: 10px;
color : #FFFFFF;
text-align: center;
}
nav{
position:fixed;
top:0px;
height: 45px;
background-color: #6eb6de;
border-bottom:1px solid #DDDDDD;
width:100%;
}
标签：script des 函数 image 搜索 box 分享 type 个人
原文地址：http://www.cnblogs.com/Sjkq1/p/7777384.html
