自己仿制谷歌和百度首页

来源:互联网 发布:js给div设置内容 编辑:程序博客网 时间:2024/05/22 06:33

有些链接会指向别处,直接上代码,算是给前端开个头

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><style type="text/css">#div1{position: absolute; width:350dp; height:200dp; left: 38%; top: 17%;}#div2{position: relative;width: 602px;height: 30px;left: -100px;top: 0px;}#input{position: relative;width: 542px;height: 40px;left: 0px;}#p{font-size: 12px;color: gray;}</style><title>Google</title></head><body><div id="div0" style="text-align: right;"><a style=" color: gray;font-size: 12px;" href="https://mail.qq.com/">Gmail</a><a style=" color: gray;font-size: 12px;" href="http://image.baidu.com/">图片</a><img src="google\photo.jpg" style="height: 12px;width: 12px"></div><div id="div1" ><img src="google\googlelogo_color_120x44dp.png"><div id="div2"><input id="input" type="text" value=""><img src="google\huatong.png" style="width: 50px;height: 40px"></div><br><br><br><div id="div3">                 <input id="btn1" type="button" value="google搜索" onclick="window.location.href='https://www.baidu.com'" style="width: 100px;height: 40px;color:  gray; text-align: center; background-color: white "><input id="btn2" type="button" value="试试手气" onclick="window.location.href='http://www.xidian.edu.cn/'" style="width: 100px;height: 40px;color:  gray; text-align: center; background-color: white ">                 </div></div><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><p id="p">   广告   商务   Google大全                                                                                                                                                                                                                                                                                           隐私权   条款   设置   Google.com  in  English</p></body></html>

下面是假百度


<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>百度一下,你就知道</title><style type="text/css">#div1{position: absolute; width:550dp; height:200dp; left: 40%; top: 10%;}#div2{position: relative;width: 600px;height: 30px;left: -110px;top: 0px;}</style><script type="text/javascript">var div0 = document.getElementById('div0');function show(){}function gone(){}</script></head><body><div id="div" style=" font-size: 12px;color: black;">  西安:天气|    <a href="http://vip.baidu.com/act/xuyuan" style="color: black;font-size: 12px">宝箱</a>    <a href="" style="color: black;font-size: 12px">换肤</a>    <a href="" style="color: black;font-size: 12px">消息</a></div><div id="div0" style="text-align:right;font-size: 12px;color: black;position: absolute;left:69%;top: 0%"><a href="http://news.baidu.com/" style="color: black;font-size: 12px">新闻</a>    <a href="https://www.hao123.com/" style="color: black;font-size: 12px">hao123</a>    <a href="http://map.baidu.com/" style="color: black;font-size: 12px">地图</a>    <a href="http://v.baidu.com/" style="color: black;font-size: 12px">视频</a>    <a href="http://tieba.baidu.com/" style="color: black;font-size: 12px">贴吧</a>    <a href="http://xueshu.baidu.com/" style="color: black;font-size: 12px">学术</a>    <a href="http://i.baidu.com/" style="color: black;font-size: 12px">诺坎普的酋长</a>  <a href="" style="color: black;font-size: 12px">设置</a>    <input type="button" value="更多产品" style="color: white;background: blue" onmouseover="show()" onmouseout="gone()"></div><hr><div id="div6"></div><div id="div1"><img src="google\bd_logo1_31bdc765.png" style="height: 155px;width: 324px;"><div id="div2"><input type="text" value="" style="width: 500px;height: 35px"><input type="button" value="百度一下" style="height:40px;width: 80px;color:white;background: blue" onclick="window.location.href='https://www.baidu.com'"></div></div><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><p style="text-align: center;color: gray;font-size: 12px">设为首页  @2017BaiDu  使用百度前必读  意见反馈  京IPC证 <br>北京公安备号</p></body></html>

效果就不上图了

0 0
原创粉丝点击