<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>ThinkingOfNewZealand</title>
<link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
<!--[if IE]><script src="http//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
<div id="wrapper"><!-- #wrapper -->
<header><!-- header -->
<h1><a href="#">Thinking of New Zealand</a></h1>
<h2>Your compelling tag line goes here</h2>
<img src="images/headerimg.jpg" width="940" height="200" alt=""><!-- header image -->
</header><!-- end of header -->
<nav><!-- top nav -->
<div class="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Support</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
</nav><!-- end of top nav -->
<section id="main"><!-- #main content and sidebar area -->
<section id="content"><!-- #content -->
<article>
<h2><a href="#">First Interesting Article or Section Title</a></h2>
<img src="images/flowersky.jpg" alt="flower" class="alignleft" /><p>This one was created as I think of my friends in New Zealand going through an earthquake, hoping they stay safe. <a href="#">Duis sagittis ipsum</a>. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Duo partem graeco repudiare ne, vix cu graeci nostrud blandit. Agam graecis omnesque usu ut, veniam commune ne sit, vide lucilius complectitur at ius.</p>
<p>Eu eirmod interesset temporibus eum, sea cu amet reque quaestio. Qui erroribus assentior disputando an, quo quot accumsan menandri te, accumsan aliquando dissentias mei ea. Autem verear molestiae an mel, nominavi expetenda similique sit ei. Commodo utroque scribentur id nam, an ferri eruditi perpetua his, et has esse facer nominavi. Mei et essent dictas aliquip. Saepe eligendi phaedrum ne vix, sit putant eruditi eloquentiam at.</p>
</article>
<article>
<h2><a href="#">Second Section or Article Title</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Usu pericula argumentum repudiandae ea, ut vis deserunt oportere, assum nominavi percipitur ei ius. Nam timeam atomorum philosophia te, ut eum amet laoreet pertinax, an duo error aperiri reformidans. Et alii quas partiendo mei, wisi quaestio convenire et vix.</p>
</article>
</section><!-- end of #content -->
<aside id="sidebar"><!-- sidebar -->
<h3>Things To Do</h3>
<ul>
<li><a href="#">Play Games</a></li>
<li><a href="#">Chat With Friends</a></li>
<li><a href="#">Swap Stories</a></li>
<li><a href="#">Sell Stuff</a></li>
<li><a href="#">Buy Stuff</a></li>
<li><a href="#">Trade Stuff</a></li>
</ul>
<h3>Sponsors</h3>
<img src="images/ad180.png" alt="" /><br /><br />
<h3>Connect With Us</h3>
<ul>
<li><a href="#">Twitter</a></li>
<li><a href="#">Facebook</a></li>
<li><a href="#">LinkedIn</a></li>
<li><a href="#">Flickr</a></li>
</ul>
</aside><!-- end of sidebar -->
</section><!-- end of #main content and sidebar-->
<footer>
<section id="footer-area">
<section id="footer-outer-block">
<aside class="footer-segment">
<h4>Friends</h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #first footer segment -->
<aside class="footer-segment">
<h4>Awesome Stuff</h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #second footer segment -->
<aside class="footer-segment">
<h4>Coolness</h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #third footer segment -->
<aside class="footer-segment">
<h4>Blahdyblah</h4>
<p>© 2010 <a href="#">yoursite.com</a> Praesent libero. Sed cursus ante dapibus diam. Sed nisi.</p>
</aside><!-- end of #fourth footer segment -->
</section><!-- end of footer-outer-block -->
</section><!-- end of footer-area -->
</footer>
</div><!-- #wrapper -->
<!-- Free template created by http//bestmoban.com -->
</body>
</html>
H329_html网站模板_网页源码移动端前端_H5模板_自适应响应式源码.zip
197 浏览量
2023-08-04
12:01:52
上传
评论
收藏 259KB ZIP 举报
H329_html网站模板_网页源码移动端前端_H5模板_自适应响应式源码.zip （7个子文件） 
H329 
index.html 5KB
print.css 328B images 
ad180.png 5KB
flowersky.jpg 10KB colbg.png 256B headerimg.jpg 242KB styles.css 3KB资源评论
