<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Author: Denis Petyukov <denis.petyukov@gmail.com> -->
<title>Century</title>
<!--[if lte IE 8]><script src="js/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<a class="logo" href="#"><h1>Century</h1></a>
<p class="logoText">Lorem ipsum dolor sit amet, sed am nonummy nibh </p>
<ul class="mainMenu">
<li><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li class="selected"><a href="#">Portfolio</a></li>
<li><a href="#">Features</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</header>
<div class="wrapMain">
<div role="main" class="main">
<div class="filter">
<em class="filterName">Filter</em>
<a class="all selected" href="#">All</a>
<a class="video" href="#">Video</a>
<a class="photography" href="#">Photography</a>
<a class="text" href="#">Text</a>
<a class="audio" href="#">Audio</a>
</div>
<div class="postExcerpts">
<div class="postExcerpt video">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Video</em>
</div>
<a class="playVideo" href="#">Play</a>
</div>
</div>
<div class="postExcerpt photography">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Photography</em>
</div>
<div class="imgWrap">
<img src="img/Tulips.jpg" alt="Tulips" width="1024" height="768">
</div>
<a class="view" href="#">View</a>
</div>
</div>
<div class="postExcerpt text">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Text</em>
</div>
<p>Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</p>
<a class="read" href="#">Read</a>
</div>
</div>
<div class="postExcerpt audio">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit adipiscing elit adipiscing elit adipiscing elit</h2>
<em class="cat">Audio</em>
</div>
<div class="audioPlayer">
<audio>
<source src="media/Maid.mp3" type="audio/mpeg">
<source src="media/Maid.ogg" type="audio/ogg">
</audio>
<a class="playAudio" href="#">Play</a>
<div class="progressBarWrap">
<div class="progressBar"></div>
</div>
<a class="mute" href="#">Mute</a>
<div class="soundBarWrap">
<div class="soundBar"></div>
</div>
</div>
</div>
</div>
<div class="postExcerpt video">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Video</em>
</div>
<a class="playVideo" href="#">Play</a>
</div>
</div>
<div class="postExcerpt photography">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Photography</em>
</div>
<div class="imgWrap">
<img src="img/Tulips.jpg" alt="Tulips" width="1024" height="768">
</div>
<a class="view" href="#">View</a>
</div>
</div>
<div class="postExcerpt text">
<div class="postExcerptInner">
<div class="titleAndCat">
<h2>Consectetuer adipiscing elit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</h2>
<em class="cat">Text</em>
</div>
<p>Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit. Lorem ipsum dolor sit amet, sed am nonummy nibh euismod tincidunut laoreet dolore magna alim erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit.</p>
H454_HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip （12个子文件） 
H454 
README.markdown 185B media Maid.mp3 3.92MB Maid.ogg 2.26MB js sort.js 3KB html5shiv.js 2KB audioPlayer.js 8KB ie8AndBelow.js 2KB img 
Tulips.jpg 583KB
buttonsAndLogo.png 64KB css style.css 28KB normalize.css 2KB
index.html 15KB资源评论
