-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
161 lines (158 loc) · 5.41 KB
/
Copy pathindex.html
File metadata and controls
161 lines (158 loc) · 5.41 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>企业网站</title>
<link rel="stylesheet" href="css/main.css">
<script src="//cdn.bootcss.com/jquery/3.1.0/jquery.slim.min.js"></script>
<script src="js/myfocus-2.0.1.min.js"></script>
</head>
<body>
<header class="top">
<div class="top-content">
<ul>
<li><a href="#">联系我们</a></li>
<li><a href="#">加入收藏</a></li>
<li><a href="#">设为首页</a></li>
</ul>
</div>
</header>
<main class="wrap">
<div class="logo">
<img src="images/logo.jpg" alt="慕课网" class="logo-left">
<div class="logo-right">
<img src="images/tel.jpg" alt="服务热线">24小时服务热线：<span class="tel">123-456-7890</span>
</div>
</div>
<nav class="nav">
<ul class="nav-list">
<li><a href="#">首页</a></li>
<li><a href="#">关于慕课</a></li>
<li><a href="#">新闻动态</a></li>
<li><a href="#">课程中心</a></li>
<li><a href="#">在线课程</a></li>
<li><a href="#">人才招聘</a></li>
</ul>
<form action="#" method="post">
<input type="text" class="search">
</form>
</nav>
<div class="ad" id="picBox">
<div class="loading"><img src="images/loading.gif" alt="loading"></div>
<div class="pic">
<ul>
<li>
<img src="images/ad2.jpg" alt="">
</li>
<li>
<img src="images/ad3.jpg" alt="">
</li>
<li>
<img src="images/ad4.jpg" alt="">
</li>
</ul>
</div>
</div>
<div class="main">
<div class="news">
<div class="title">
<h2 class="title-left">新闻中心</h2><a href="list.html" class="title-right">More>></a>
</div>
<div class="pic-news">
<img src="images/news.jpg" alt="">
<h2><a href="news.html">520 慕女神喊你来表白!</a></h2>
<p>活动时间5月20日--5月25日
<br>获奖公布时间：5月26日
<br><a href="#">Learn More>></a></p>
</div>
<div class="news-list">
<ul>
<li><a href="#">【慕课访谈 用户篇】“有为屌丝”在路上</a><span>2014-06-01</span></li>
<li><a href="#">【有奖活动】给父亲的三行书信</a><span>2014-06-01</span></li>
<li><a href="#"> 《程序猿，请晒出你的童年》活动获奖公告</a><span>2014-05-30</span></li>
<li><a href="#">【慕课访谈】破茧成蝶——美女程序猿的锐变史</a><span>2014-05-28</span></li>
</ul>
</div>
</div>
<div class="course">
<div class="title">
<h2 class="title-left">课程中心</h2><a href="#" class="title-right">More>></a>
</div>
<div class="course-pic">
<img src="images/css.jpg" alt="">
<h2><a href="#">CSS圆角进化论</a></h2>
<p>
CSS圆角的实现，经历了三大发展阶段：背景图片方式、CSS2.0+HTMl标签模拟、CSS3.0圆角属性）。本案例详细讲解每一种的实现方式，并对实现的优缺点进行对比分析。
</p>
</div>
<div class="course-type">
<ul>
<li>PHP开发</li>
<li>前端开发</li>
<li>JAVA开发</li>
<li>Android开发</li>
</ul>
</div>
</div>
<div class="sidebar">
<div class="title">
<h2 class="title-left">媒体聚焦</h2><a href="#" class="title-right">More>></a>
</div>
<div class="vedio">
<embed src="http://player.youku.com/player.php/sid/XNjkzMDE5MTUy/v.swf" allowfullscreen="true" quality="high" width="220" height="140" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash" title="Adobe Flash Player" class="video">
</div>
<img src="images/app.jpg" alt="" class="sidebar-ad">
</div>
</div>
</main>
<footer class="copyright">
<ul class="copyright-content">
<li>
<h2>关于</h2>
<ul class="content-detail">
<li><a href="#">品牌故事</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">加入我们</a></li>
<li><a href="#">版权声明</a></li>
</ul>
</li>
<li>
<h2>课程</h2>
<ul class="content-detail">
<li><a href="#">PHP开发</a></li>
<li><a href="#">前端开发</a></li>
<li><a href="#">JAVA开发</a></li>
<li><a href="#">Android开发</a></li>
</ul>
</li>
<li>
<h2>关注</h2>
<ul class="content-detail">
<li><a href="#">新浪微博</a></li>
<li><a href="#">腾讯微博</a></li>
<li><a href="#">企业微信</a></li>
<li><a href="#">QQ空间</a></li>
</ul>
</li>
<li>
<h2>留言</h2>
<ul class="content-detail">
<li><a href="#">意见反馈</a></li>
<li><a href="#">问题留言</a></li>
<li><a href="#">媒体联络</a></li>
<li><a href="#">在线客服</a></li>
</ul>
</li>
<li class="weixin">
<h2>微信关注</h2>
<img src="images/qrcode.jpg" alt="微信二维码">
</li>
</ul>
</footer>
<script>
myFocus.set({
id: 'picBox'
});
</script>
</body>
</html>