template design by http://www.20shx.com/
时间:2014-03-13 发布人:SHX 浏览次数:4376 评论:3
今天,我在留言版中看见一哥门给我留言,说我的留言版不错,希望我把源码分享出来。其实共享出来也没什么关系,但是我总觉的纸上得来终觉浅。想了想,觉得还是下写一篇如何仿下自己喜欢的页面。过几天在把留言源码分享出来。授人与鱼不如授人与渔。
现在只要你用的不是比较老的浏览器,鼠标右键都有一个查看源代码(推荐在高速模式下去查看,因为兼容模式下出来的是TXT文档,高速下出来的是网页并且有链接,有颜色标示。我这里说的是提供双模式的国内浏览器,当然只要能查看源码的浏览器都可以),基本就可以看到这个页面的代码了。
首先,先在头部把CSS文件和JS文件下下来,在就是把body中间的img图片下载下来,把整个页面的代码保存下来。
在就打开CSS文件,把里面的URL文件指向的图片也下载下来。
最后,在本地按着他的路径,把CSS、JS、图片放好,基本一个网页也就仿好了。
当然,如果你充分会用浏览器的话,浏览器其实还提供很多功能的。在高速模式下,还有审核元素。里面有很多强大的功能,是挖去被人网站的神器,我见那些大神们不用看代码用浏览器轻松的挖去到优酷的评论等各种信息接口。
如果,你觉得你可以的话,是网页制作的初学者。你可以试着先前挖一挖一些简单的页面,很好玩的。我网站的图片泛光其实就是我挖的360网站的。
http://www.20shx.com/message/ 这里简单教一下新手:
<head> <meta charset="utf-8"> <title>留言版 -- 技术宅</title> <link rel="stylesheet" href="css/index.css"> <script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src='js/index.js'></script> </head>
这里面就有 一个CSS和两个JS
<body> <div class="backhome"><a href="http://www.20shx.com/">返回首页</a></div> <div id='top'> <span id='send'></span> </div> <div id='main'> <dl class='paper a2'> <dt> <span class='username'>子非鱼</span> <span class='num'>No.7576141</span> </dt> <dd class='content'>留言板不错哦~</dd> <dd class='bottom'> <span class='time'>2014-03-13 13:31:45</span> <a href="" class='close'></a> </dd> </dl> //.....省略这里是留言内容,用PHP等语言后台调出 </div> <div id='send-form'> <p class='title'><span>写下你的留言</span><a href="" id='close'></a></p> <form action="" name='message' method="post" onSubmit="return check_message(this)"> //.....省略这里是留言提交框 </form> </div> </body>
把里了的<img src="" />中的图片下载下来保存相对的路径就OK了,一个网页就这样仿下来的。
上一篇:创业公司初始阶段效率的重要性下一篇:HTML5新增的input输入类型