Skip to content

Pwnanand/First-web

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 

Repository files navigation

<title>Single Post | HTML5 Blog</title>
	<!-- Include Stylesheets -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">
	
	<!-- Include JQuery -->
	<script src="js/vendor/jquery-1.11.0.min.js"></script>
	<!-- Modernizr -->
    <script src="js/vendor/modernizr-2.6.2.min.js"></script>
	<!-- Main JavaScript -->
	<script src="js/main.js"></script>
</head>
<body>
	<header id="main-header">
		<div class="container">
			<div id="branding">
				<img src="img/logo.png" alt="The TechEdge">
				<h1>The TechEdge</h1>
			</div><!-- branding -->
			<nav id="main-nav">
				<ul>
					<li><a href="index.html">Home</a></li>
					<li><a href="single-post.html">Single Post</a></li>
					<li><a href="add-post.html">Add Post</a></li>
				</ul>
			</nav>
		</div><!-- container -->
	</header>
	<div class="container">
	<aside id="sidebar">
		<div class="search">
			<form>
				<input type="search" placeholder="Search Our Blog..."><input type="image" src="img/search.png" alt="Search">
			</form>
		</div><!-- search -->
		<div class="clearfix"></div>
		<nav id="sub-nav">
			<ul>
				<li><a href="#">Web Development</a></li>
				<li><a href="#">Design</a></li>
				<li><a href="#">SEO & Marketing</a></li>
				<li><a href="#">Cloud & Hosting</a></li>
				<li><a href="#">Gadgets</a></li>
				<li><a href="#">Software</a></li>
			</ul>
		</nav>
		<div class="ad">
			<img src="img/ad.jpg" alt="Advertisement">
		</div>
	</aside>
	<section id="content">
		<article>
			<header>
				<h2>Facebook launches friend-tracking feature</h2>
				<div class="meta">
					Posted By <strong>Brad Traversy 1 Day Ago</strong> <span>(2 Comments)</span>
				</div><!-- meta-->
			</header>
			<img src="img/blog1.jpg" alt="Post 1">
			<p>Nam tempor turpis et urna sagittis pharetra. Nullam molestie lorem non arcu venenatis, non imperdiet neque venenatis. Praesent sed dignissim velit. Nam vel lorem velit. Aliquam eget neque pretium, placerat magna at, consectetur arcu. In ac feugiat quam. Fusce consequat pellentesque lacinia. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam fermentum, lacus sed aliquam auctor, dui diam porta ipsum, eget luctus elit est sit amet magna</p>
			<p>Nullam molestie lorem non arcu venenatis, non imperdiet neque venenatis. Praesent sed dignissim velit. Nam vel lorem velit. Aliquam eget neque pretium, placerat magna at, consectetur arcu. In ac feugiat quam. Fusce consequat pellentesque lacinia. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam fermentum, lacus sed aliquam auctor, dui diam porta ipsum, eget luctus elit est sit amet magna</p>
			<p>Venenatis, non imperdiet neque venenatis. Praesent sed dignissim velit. Nam vel lorem velit. Aliquam eget neque pretium, placerat magna at, consectetur arcu. In ac feugiat quam. Fusce consequat pellentesque lacinia. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam fermentum, lacus sed aliquam auctor, dui diam porta ipsum, eget luctus elit est sit amet magna</p>			
		</article>	
			<footer id="comments">
				<h3>Recent Comments</h3>
				<div class="comment-left">
					<img src="img/avatar.png">
				</div><!-- comment left -->
				<div class="comment-right">
					<strong>John Doe</strong> Wrote:
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sollicitudin risus sed facilisis viverra.</p>
				</div><!-- comment right -->
				<div class="clearfix"></div>
				<hr>
				<div class="comment-left">
					<img src="img/avatar.png">
				</div><!-- comment left -->
				<div class="comment-right">
					<strong>John Doe</strong> Wrote:
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sollicitudin risus sed facilisis viverra.</p>
				</div><!-- comment right -->
				<div class="clearfix"></div>
				<div class="comment-form">
					<h3>Leave Comment</h3>
					<form>
						<p><label>Name: </label><input type="text"></p>
						<p><label>Email: </label><input type="email"></p>
						<p><label>Comment: </label><textarea></textarea></p>
						<p><button>Add Comment</button></p>
					</form>
				</div><!-- contact form -->
			</footer>
	</section>
	<div class="clearfix"></div>	
	</div><!-- container -->
	
	<footer id="main-footer">
            <div class="container">
				<div class="footer-right">
					<nav class="footer-nav">
						<ul>
							<li><a href="#" class="active">Home</a></li>
							<li><a href="#">About Us</a></li>
							<li><a href="#">Contact Us</a></li>
							<li><a href="#">Resources</a></li>
							<li><a href="#">Terms of Use</a></li>
							<li><a href="#">Privacy Policy</a></li>
						</ul>
					</nav>
					<nav class="footer-nav">
						<ul>
							<li><a href="#" class="active">Web Development</a></li>
							<li><a href="#">Design</a></li>
							<li><a href="#">Cloud & Hosting</a></li>
							<li><a href="#">Gadgets</a></li>
							<li><a href="#">Software</a></li>
							<li><a href="#">SEO & Marketing</a></li>
						</ul>
					</nav>
					<nav class="footer-nav">
						<ul>
							<li><a href="#" class="active">Web Development</a></li>
							<li><a href="#">Design</a></li>
							<li><a href="#">Cloud & Hosting</a></li>
							<li><a href="#">Gadgets</a></li>
							<li><a href="#">Software</a></li>
							<li><a href="#">SEO & Marketing</a></li>
						</ul>
					</nav>
				</div>
				<div class="footer-left">
					<p class="copy">Copyright &copy; 2014, The TechEdge</p>
				</div>
			</div>
		</footer>
</body>

About

using HTML5,JavaScript,JQuery

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published