源码链接:https://gitee.com/tangjiahao/2017_software_engineering.git

原网页链接:https://pinyin.sogou.com/

原网站:

我的网页效果:

HTML代码:

  1 <!DOCTYPE>
  2 <head>
  3 <meta charset="utf-8">
  4 <title>搜狗输入法</title>
  5 <link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
  6 </head>
  7 <body>
  8
  9 <div id="header">
 10
 11     <div id="product">
 12         <div id="topnav">
 13             <ul>
 14                 <li>
 15                     <div class="topnav_name"><a >输入法手机版&nbsp;&nbsp;</a></div>
 16                 </li>
 17                  <li>
 18                     <div class="topnav_name"><a >输入法Mac版&nbsp;&nbsp;</a></div>
 19                 </li>
 20                 <li>
 21                     <div class="topnav_name"><a >输入法Linux版&nbsp;&nbsp;</a></div>
 22                 </li>
 23                 <li>
 24                     <div class="topnav_name"><a >五笔输入法&nbsp;&nbsp;</a></div>
 25                 </li>
 26                 <li>
 27                     <div class="topnav_name"><a >浏览器&nbsp;&nbsp;</a></div>
 28                 </li>
 29                 <li>
 30                     <div class="topnav_name"><a >手机助手&nbsp;&nbsp;</a></div>
 31                 </li>
 32             </ul>
 33         </div>
 34         <div id="user_info">
 35             <ul>
 36             <li>
 37                 <div><a >登录&nbsp;&nbsp;&nbsp;注册&nbsp;</a></div>
 38             </li>
 39             </ul>
 40         </div>
 41     </div>
 42
 43     <div id="logo">
 44         <img src="img/logo.png"/>
 45     </div>
 46
 47     <div id="search_input">
 48          <form onsubmit="" id="searchForm" method="get" action="/search/search_list/">
 49             <input type="text" name="word" value="" id="searchTip" autocomplete="off"  />
 50           </form>
 51     </div>
 52
 53     <div id="nav_list">
 54     <ul>
 55         <li>
 56             <a class='current' ><div class="nav_name">首页</div></a>
 57         </li>
 58         <li>
 59             <a ><div class="nav_name">皮肤</div></a>
 60         </li>
 61         <li>
 62             <a ><div class="nav_name">词库</div></a>
 63         </li>
 64         <li >
 65             <a ><div class="nav_name">皮肤表情开放平台</div></a>
 66         </li>
 67         <li>
 68             <a ><div class="nav_name ">字媒体</div></a>
 69         </li>
 70         <li>
 71             <a ><div class="nav_name">帮助</div></a>
 72         </li>
 73         <li>
 74             <a ><div class="nav_name">升级日志</div></a>
 75         </li>
 76         <li class="nav_list_last">
 77             <a ><div class="nav_name">论坛</div></a>
 78         </li>
 79     </ul>
 80     </div>
 81
 82 </div>
 83
 84 <div id='wrapper_main'>
 85
 86 <div class="focus">
 87 </div>
 88
 89 <div id="main_index">
 90     <div id="skin_title"></div>
 91
 92     <div id="skin_list">
 93         <ul>
 94             <li id="skin_1">
 95                 <div class="img">
 96                     <a ><img src="img/15529863089788_former.png"  alt="【粉丝投稿】奇迹暖暖" title="【粉丝投稿】奇迹暖暖" height="110" width="320" /></a>
 97                 </div>
 98                 <div class="r_sk_inf">
 99                     <div class="skin_content"><span><a >【粉丝投稿】奇迹暖暖</a></span></div>
100                     <div class="skin_download"><a ></a></div>
101                 </div>
102             </li>
103             <li id="skin_1">
104                 <div class="img">
105                     <a ><img src="img/15532687674146_former.png"  alt="【十月】绿" title="【十月】绿" height="110" width="320" /></a>
106                 </div>
107                 <div class="r_sk_inf">
108                     <div class="skin_content"><span><a >【十月】绿</a></span></div>
109                     <div class="skin_download"><a ></a></div>
110                 </div>
111             </li>
112             <li id="skin_1">
113                 <div class="img">
114                     <a ><img src="img/15535084988237_former.jpg"  alt="【栗子】精灵少女" title="【栗子】精灵少女" height="110" width="320" /></a>
115                 </div>
116                 <div class="r_sk_inf">
117                     <div class="skin_content"><span><a >【栗子】精灵少女</a></span></div>
118                     <div class="skin_download"><a ></a></div>
119                 </div>
120             </li>
121             <li id="skin_1">
122                 <div class="img">
123                     <a ><img src="img/15535045549870_former.jpg"  alt="小可爱鹿" title="小可爱鹿" height="110" width="320" /></a>
124                                     </div>
125                 <div class="r_sk_inf">
126                     <div class="skin_content"><span><a >小可爱鹿</a></span></div>
127                     <div class="skin_download"><a ></a></div>
128                 </div>
129             </li>
130             <li id="skin_1">
131                 <div class="img">
132                     <a ><img src="img/15533067609641_former.gif"  alt="【明玥】炫彩星球." title="【明玥】炫彩星球." height="110" width="320" /></a>
133                 </div>
134                 <div class="r_sk_inf">
135                     <div class="skin_content"><span><a >【明玥】炫彩星球.</a></span></div>
136                     <div class="skin_download"><a ></a></div>
137                 </div>
138             </li>
139             <li id="skin_1">
140                 <div class="img">
141                     <a ><img src="img/15534958228445_former.jpg"  alt="【喵姐姐】和风物语" title="【喵姐姐】和风物语" height="110" width="320" /></a>
142             </div>
143                 <div class="r_sk_inf">
144                     <div class="skin_content"><span><a >【喵姐姐】和风物语</a></span></div>
145                     <div class="skin_download"><a ></a></div>
146                 </div>
147             </li>
148             </ul>
149
150     </div>
151     <div id="skin_ex_func_title"></div>
152     <div id="skin_ex_func_list">
153         <ul>
154             <li><a  title="截屏"><img src="img/id_1.png" /></a><a class="down_ex_func" id="down_ex_func1"  ></a></li>
155             <li><a  title="手写输入"><img src="img/id_2.png" /></a><a class="down_ex_func" id="down_ex_func2" ></a></li>
156             <li><a  title="皮肤盒子"><img src="img/id_3.png"/></a><a class="down_ex_func" id="down_ex_func3" ></a></li>
157             <li><a  title="鼠标手势"><img src="img/id_4.png" /></a><a class="down_ex_func" id="down_ex_func4" ></a></li>
158             <li><a  title="图片表情"><img src="img/id_5.png" /></a><a class="down_ex_func" id="down_ex_func5" ></a></li>
159             <li><a  title="特效输入"><img src="img/id_6_2.png" /></a><a class="down_ex_func" id="down_ex_func6" ></a></li>
160         </ul>
161
162     </div>
163
164     <div id="dict_show_title"></div>
165     <div id="dict_show_list">
166         <ul>
167             <li><a class="dict_r" >
168                 <img src="img/daxuexiaoban.jpg"  /></a>
169                 <span><a >工作细胞</a></span></li>
170             <li><a class="dict_r" >
171                 <img src="img/dacaiwu.gif"  /></a>
172                 <span><a >财务专用</a></span></li>
173             <li><a class="dict_r" >
174                 <img src="img/jiada.jpg"  /></a>
175                 <span><a >贾平凹作品</a></span></li>
176             <li><a class="dict_r" >
177                 <img src="img/jiepo.jpg"  /></a>
178                 <span><a >解剖学名词</a></span></li>
179             <li><a class="dict_r" >
180                 <img src="img/luyouda.jpg"  /></a>
181                 <span><a >陆游经典名句</a></span></li>
182             <li><a class="dict_r" >
183                 <img src="img/shijingjj.jpg"  /></a>
184                 <span><a >诗经</a></span></li>
185         </ul>
186     </div>
187 </div>
188
189 <div id="sidebar">
190     <a href="" id="skin_pic"></a>
191     <div id="new_activity">
192         <div id="new_activity_title"></div>
193         <ul>
194             <li><a style="color:#FF0000;" >搜狗输入法Linux版支持双拼啦!</a></li>
195             <li><a >新词特色主题图之旅,一起穿越吧!</a></li>
196             <li><a style="color:#FF0000;" >萌萌的颜文字一键下载直接使用!</a></li>
197             <li><a >想做皮肤?皮肤编辑器使用技巧大揭秘</a></li>
198         </ul>
199     </div>
200
201     <div id="focus_us">
202         <div id='sinaWeibo'><a ></a></div>
203         <div id='keFu'><a ></a ></div>
204     </div>
205
206
207 <div id="download_list">
208     <ul>
209         <li>
210             <a >点击查看</a></li>
211         <li><a >立即下载</a></li>
212         <li><a >立即下载</a></li>
213     </ul>
214 </div>
215 </div>
216 </div>
217
218 <div>
219     <div class="banner_sides" id="banner_side0">
220         <div  class="banner_swap">
221         </div>
222     </div>
223     </div>
224 </div>
225 </body>
226 </html>

转载于:https://www.cnblogs.com/tangjiahao/p/10634018.html

软件工程第二次作业——模仿主流网站:搜狗输入法相关推荐

  1. 软件工程第二次作业——模仿网站

    我以我的JS发誓 我以我的解释器宣告 将世界上所有的HTML汇聚 将世界上应有之css样式改变 集中所有的解释器和JS 将这网页为我所用 the Teleport Ultra 倾听我内心的愿望 让它实 ...

  2. 软件工程 第二周作业

    ##软件工程第二周作业 提出问题 1. 一般来说,想要自己的程序跑得又快又好,就要减少函数的反复调用,但有所得则必有所失,效能提高就有可能伴随着程序的稳定性的降低,这两者应该如何权衡呢? 2. 关于5 ...

  3. 2022OUC软件工程第二次作业-08组

    第二次作业:深度学习基础 一.金知霖 一.视频学习心得及问题总结 人工智能:使一部机器像人一样进行感知.认知.决策.执行的人工程序或系统 人工智能三个层面:计算智能.感知智能.认知智能 机器学习的定义 ...

  4. 北航2022软件工程第二次作业——产品评测、分析与规划

    软件工程第二次分析作业 项目 内容 这个作业属于哪个课程 北京航空航天大学2022春季软件工程(罗杰 任健) 这个作业的要求在哪里 个人阅读作业-软件案例分析 我在这个课程的目标是 学习软件工程的基础 ...

  5. 本周总结 前端第二次作业 模仿制作百度界面

    前端第二次作业: 制作百度界面: https://www.baidu.com/ 要求: 模仿制作,相似度达99%. 仿照https://www.runoob.com/css/css-tutorial. ...

  6. 集大1513 1514班 软件工程第二次作业评分与点评

    谢谢按时完成作业的同学. 请大家在今后的作业中多思考,认真完成并注意作业的原创性. 学号 作业标题 作业地址 提交日期 分数 201521121087 微信APP简要分析 http://www.cnb ...

  7. 2016福州大学软件工程第二次作业成绩

    第二次作业为结对项目之需求分析与原型设计 以下为作业成绩: 学号 姓名 昵称 评分 031402524 王智强 iphone2s 9 031402509 胡泽善 aiprogram 9 0314025 ...

  8. 现代软件工程第二次作业-github初使用及CanTool需求文档

    作业要求: 完成下面的题目,并在小组博客中写出整个操作过程及学习心得(图文并茂):(每人都要在小组博客中写出来,并注明姓名) 1.参照 http://www.cnblogs.com/xinz/p/38 ...

  9. 软件工程第二次作业(原型设计)

    课程名称:软件工程实践 作业要求:结对第一次-原型设计(文献摘要热词统计) 结对学号:221600428 | 221600438 作业目标:了解NABCD模型,学习建立软件原型 原型工具:墨刀 PDF ...

最新文章

  1. 【安全实战】红队攻防技术
  2. 【互联网今日大事儿记】小米要做汽车了嘛!
  3. [SDOI2013]直径 (树的直径,贪心)
  4. MongoDB(二):MongoDB的安装
  5. PHP中4个包含文件方法的差异
  6. shell脚本中if流程控制语句的应用
  7. python打砖块游戏算法设计分析_python小游戏--打砖块的实现与讲解(python自学总结系列)...
  8. 数学分析第四版上册70页14题
  9. 追梦App系列博客——需求分析报告
  10. html怎么给图片加倒影,用CSS3实现图片倒影效果,同时给出兼容早期版本IE的方案...
  11. A股实践 :图神经网络与新闻共现矩阵策略(附代码)
  12. 一个屌丝程序员的青春(四九)
  13. 记go语言椭圆曲线算法公私钥验证补充
  14. 记录Google被和谐的日子
  15. vue项目中表格删除数据页码显示注意点
  16. 谷歌protobuf(Protocol buffers)的使用
  17. 做人要心正,待人要心诚
  18. 班主任工作总结(2013年度)
  19. ping命令指定包大小
  20. 关于发那科机器人点焊故障处理方法

热门文章

  1. css 中 border 断线解决,简单实用
  2. sql server 2005 T-SQL CEILING (Transact-SQL)
  3. 容器(一)剖析面试最常见问题之 Java 集合框架
  4. 如何让自己时刻冷静的方法_如何锻炼自己的口才及沟通技巧?这5个方法让你受用一辈子...
  5. word python 域 操作_python实现在windows下操作word的方法
  6. php依次替换src,如何在php中替换img中src内容
  7. java同时执行同一个方法吗_java 返回结果的同时执行另一个方法
  8. 伪元素写竖线_用伪元素画出太极图
  9. 10锁屏幻灯片_手机跟我学第一百八十八课——如何设置锁屏
  10. java中的for-each循环