标签:doctype 底部 模板 alt style lang var 20px dex
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link href="../static/base.css" rel="stylesheet" type="text/css"> <script src="../static/base.js"></script> </head> <body class="bodycolor" id="myBody"> <div class="daohanglang" id="daohanglang"> <nav> <img class="turn_on_off" id="on_off" onclick="mySwitch()" src="../static/image/on.jpg" width="40px"> <a class="daohang" href="">首页</a> <a class="daohang" href="">卢浮宫</a> <a class="daohang" href="">塞纳河</a> <a class="daohang" href="">埃菲尔铁塔</a> <a class="daohang" href="">香榭丽大道</a> <a class="daohang" href="">巴黎圣母院</a> <input class="sousuo" id="sousuo" type="text" placeholder="搜索" > <img onclick="chaZhao()" id="chazhao" src="../static/image/on.jpg" width="20px"> <a class="daohangright" href="" >登录</a> </nav> <HR align=center width=100% color=#c0c0c0 SIZE=1> </div> <div class="foot-menu" id="dibudaohang"> <HR align=center width=100% color=#c0c0c0 SIZE=1> <nav> <a class="daohang" href="">法国历史</a> <a class="daohang" href="">法国地图</a> <a class="daohang" href="">旅行攻略</a> </nav> <p>版权@ linxx</p> </div>
css
.daohang{ text-decoration:none; font-weight:bold; font-size:xx-large; margin-right:20px; color: #ff6633; font-family: "华文行楷"; margin-top:30px; } .daohangright{ margin-top:60px; color: #ff6633; text-decoration:none; font-weight:bold; float:right; font-family: "华文行楷"; font-size: xx-large; } .turn_on_off{ margin-top:30px; margin-right:20px; } .shousuo{ width: 15%; hight:12%; } .bodycolor{ background-color: white; } .daohanglang{ background-color: white; } .foot-menu{ width:100%; height:60px; background-color:white; position:fixed; bottom:0;/**距离底部为0*/left:0;z-index:1; }
js
function mySwitch() { var myele = document.getElementById("on_off") if (myele.src.match("on")) { myele.src = "../static/image/off.jpg" document.getElementById("myBody").style.background = "#333333" document.getElementById("daohanglang").style.background="#333333" document.getElementById("demo").style.color = "white" } else { myele.src = "../static/image/on.jpg" document.getElementById("myBody").style.background = "white" document.getElementById("daohanglang").style.background="white" document.getElementById("demo").style.color = "black" } }
标签:doctype 底部 模板 alt style lang var 20px dex
原文地址:http://www.cnblogs.com/xxxiaoxiannv/p/7780211.html