-
Notifications
You must be signed in to change notification settings - Fork 0
/
post01.html
207 lines (197 loc) · 9.73 KB
/
post01.html
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
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Gong's family -- 致那些年最美好的记忆</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="author" content="Ryan">
<meta name="Description" content="Personal HTML5 for Gentileman Gong">
<link rel="shortcut icon" href="images/icons/favicon.ico" type="image/x-icon">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="css/contact.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/styles.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/responsive.css" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">
#QRcodeImg{
background:url("images/qrcodeimg.png" ) no-repeat 0px 0px;
width: 150px;
height: 150px;
position: absolute;/*可以覆盖在内容之上，因为采用absolute时，脱离文档流 */
right:10px;
bottom: 50px;
z-index: 1002;
display: none;
}
footer div p a:hover #QRcodeImg{
display:block;
}
</style>
<script src="js/modernizr.js" type="text/javascript"></script>
</head>
<body class="centered-tiles only-3columns">
<!-- start preloader -->
<div id="preloader">
<div id="status">
<div class="parent">
<div class="child">
<p>loading</p>
</div>
</div>
</div>
</div>
<!-- end preloader -->
<!-- start main nav -->
<nav id="main-nav">
<ul id="options" class="clearfix">
<li> <a href="index.html#home">首页</a> </li>
<li> <a href="index.html#portfolio" class="selected">姓氏源起</a></li>
<li> <a href="index.html#services">家族相册</a> </li>
<li> <a href="index.html#agency">时光机</a> </li>
<li> <a href="index.html#blog">Blog</a> </li>
<li> <a href="#" class="sub-nav-toggle">经典推荐</a>
<ul class="sub-nav hidden">
<li> <a href="project01.html">书籍</a> </li>
<li> <a href="project02.html">电影</a> </li>
<li> <a href="post01.html">音乐</a> </li>
</ul>
</li>
<li> <a href="index.html#contact">联系我们</a> </li>
</ul>
<ul class="social-list clearfix">
<li> <a href="#"><i class="fa fa-qrcode"></i></a> </li>
<li> <a href="#"><i class="fa fa-weixin"></i></a> </li>
<li> <a href="#"><i class="fa fa-qq"></i></a> </li>
</ul>
</nav>
<!-- end main nav -->
<div id="wrap">
<div class="content-wrapper">
<!-- start header -->
<header id="header" class="clearfix">
<ul class="social-list clearfix not-white">
<li> <a href="#" class="circled"><i class="fa fa-qrcode"></i> </a> </li>
<li> <a href="#" class="circled"><i class="fa fa-weixin"></i> </a> </li>
<li> <a href="#" class="circled"><i class="fa fa-qq"></i> </a> </li>
</ul>
<div class="logo-wrapper">
<h1 id="logo"><a href="index.html">Ridgewood</a></h1>
</div>
<div id="menu-button">
<div class="centralizer">
<div class="cursor">
<div id="nav-button"> <span class="nav-bar"></span> <span class="nav-bar"></span> <span class="nav-bar"></span> </div>
</div>
</div>
</div>
</header>
<!-- end header -->
<!-- start content -->
<div id="content">
<div id="container" class="clearfix">
<article class="element clearfix col3-3 home white auto">
<div class="boxed">
<div class="header-section">
<div class="avatar"><img src="images/about03.jpg" alt="" /></div>
<h5 class="header"><span class="italic">by</span> John Doe</h5>
<p class="below-button">June 13, 2016</p>
</div>
<h2 class="header">Speaking at Technarte <br />
<span class="italic">in</span> Bilbao, Spain</h2>
<p class="large">This is dummy copy. It is not meant to be read. It has been placed here solely to demonstrate the look and feel of finished, typeset text. Only for show. He who searches for meaning here will be sorely disappointed.</p>
<p>Our collection of modern <a href="#">hipster</a> photographic images. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In the 1980s, Vestibulum id ligula felisat euismod semper. Donec id elit non mi porta gravida at eget metos. Donec sed odio dui. Maecenas faucibus mollis interdum. Duis mollis est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<ul class="unordered-list">
<li> <strong>Game Design</strong>: services include digital content and in-store digital experience</li>
<li> <strong>Creative R & D</strong>: combined strategic planning expertise with our creative resources.</li>
<li> <strong>Photography</strong>: in-house 9,500 sqft photographic studio </li>
</ul>
<p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<div class="bottom-section">
<ul class="tag-list clearfix">
<li><a href="#" title="">Creative R&D <span>3</span></a></li>
<li><a href="#" title="">Photography <span>1</span></a></li>
</ul>
</div>
</div>
</article>
<article class="element clearfix col3-3 home white auto">
<div class="boxed">
<h3 class="header">Comments</h3>
<div class="break"></div>
<div class="comment clearfix">
<div class="commenter-avatar"> <img alt="" src="images/about01.jpg" /> </div>
<div class="comment-content">
<p class="time">October 3, 2016</p>
<h5>Tobias Schmied</h5>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr sed diam nonumy.</p>
</div>
<div class="comment-reply-button-column"> <a href="#" class="button">Reply</a> </div>
</div>
<div class="comment clearfix">
<div class="commenter-avatar"> <img alt="" src="images/about02.jpg" /> </div>
<div class="comment-content">
<p class="time">October 3, 2016</p>
<h5>Mark McDougal</h5>
<p>Justo quam fellis, ultricies pellentesque eu, pretium quis sem.</p>
</div>
<div class="comment-reply-button-column"> <a href="#" class="button">Reply</a> </div>
</div>
<div class="comment-form-wrapper"> <a href="#" title="">
<div class="comment-form-icon-wrapper">
<div class="circle-anim"></div>
</div>
</a>
<form class="comment-form" method="post" action="contact.php" name="contactform" id="contactform" autocomplete="off">
<input name="name" type="text" id="name" title="Name" />
<input name="email" type="text" id="email" title="Email" />
<textarea name="comments" id="comments" title="Your Message"></textarea>
<div class="input-wrapper clearfix">
<input type="submit" class="send-btn" value="Post Comment" id="submit" name="Submit" />
<span id="message"></span></div>
</form>
</div>
</div>
</article>
</div>
</div>
<!-- end content -->
</div>
<!-- end content-wrapper -->
</div>
<!-- end wrap -->
<footer id="footer" class="clearfix">
<div class="container" style="padding:10px;"> <p class="text-center" id="now_time"></p></div>
<div class="padding-wrapper">
<p class="alignleft">© <span id="now_year">0000</span>, Gong's family All Rights Reserved</p>
<p class="alignright">Made with <i class="fa fa-heart"></i> by <a href="#" id="qrcode_link">Ryan<img id="QRcodeImg"></a></p>
</div>
</footer>
<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>
<script src="js/jquery-easing-1.3.js" type="text/javascript"></script>
<script src="js/jquery.touchSwipe.min.js" type="text/javascript"></script>
<script src="js/jquery.isotope2.min.js" type="text/javascript"></script>
<script src="js/jquery.ba-bbq.min.js" type="text/javascript"></script>
<script src="js/packery-mode.pkgd.min.js" type="text/javascript"></script>
<script src="js/jquery.isotope.load.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
<script src="js/jquery.form.js" type="text/javascript"></script>
<script src="js/input.fields.js" type="text/javascript"></script>
<script src="js/preloader.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/jquery.sliphover.min.js"></script>
<script type="text/javascript">
$(function(){
var myDate = new Date;
var year = myDate.getFullYear(); //获取当前年
var mon = myDate.getMonth() + 1; //获取当前月
var date = myDate.getDate(); //获取当前日
var week = myDate.getDay();
var weeks = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
$("#now_time").text("今天是"+year + "年" + mon + "月" + date + "日" + weeks[week]);
$("#now_year").text(year);
});
</script>
</body>
</html>