Skip to main content

A fully responsive Code HTML & CSS

 


A fully responsive Code HTML & CSS

<html>

<head>

<title>JNBCS TEMPLATED</title>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />

<link rel="stylesheet" href="assets/css/main.css" />

</head>

<body>


<!-- Header -->

<header id="header">

<div class="inner">

<a href="index.html" class="logo">JNBCS</a>

<nav id="nav">

<a href="index.html">Home</a>

<a href="generic.html">Generic</a>

<a href="elements.html">Elements</a>

</nav>

</div>

</header>

<a href="#menu" class="navPanelToggle"><span class="fa fa-bars"></span></a>


<!-- Banner -->

<section id="banner">

<div class="inner">

<h1>JNBCS<span>A fully responsive<br />

site template by JNBCS</span></h1>

<ul class="actions">

<li><a href="#" class="button alt">Get Started</a></li>

</ul>

</div>

</section>


<!-- One -->

<section id="one">

<div class="inner">

<header>

<h2>Magna Etiam Lorem</h2>

</header>

<p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet nibh viverra malesuada. Nunc sem lacus, accumsan quis, faucibus non, congue vel, arcu, erisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</section>


<!-- Two -->

<section id="two">

<div class="inner">

<article>

<div class="content">

<header>

<h3>Pellentesque adipis</h3>

</header>

<div class="image fit">

<img src="images/pic01.jpg" alt="" />

</div>

<p>Cumsan mollis eros. Pellentesque a diam sit amet mi magna ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet lorem ipsum feugiat tempus.</p>

</div>

</article>

<article class="alt">

<div class="content">

<header>

<h3>Morbi interdum mol</h3>

</header>

<div class="image fit">

<img src="images/pic02.jpg" alt="" />

</div>

<p>Cumsan mollis eros. Pellentesque a diam sit amet mi magna ullamcorper vehicula. Integer adipiscin sem. Nullam quis massa sit amet lorem ipsum feugiat tempus.</p>

</div>

</article>

</div>

</section>


<!-- Three -->

<section id="three">

<div class="inner">

<article>

<div class="content">

<span class="icon fa-laptop"></span>

<header>

<h3>Tempus Feugiat</h3>

</header>

<p>Morbi interdum mollis sapien. Sed ac risus. Phasellus lacinia, magna lorem ullamcorper laoreet, lectus arcu.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

<article>

<div class="content">

<span class="icon fa-diamond"></span>

<header>

<h3>Aliquam Nulla</h3>

</header>

<p>Ut convallis, sem sit amet interdum consectetuer, odio augue aliquam leo, nec dapibus tortor nibh sed.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

<article>

<div class="content">

<span class="icon fa-laptop"></span>

<header>

<h3>Sed Magna</h3>

</header>

<p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula.</p>

<ul class="actions">

<li><a href="#" class="button alt">Learn More</a></li>

</ul>

</div>

</article>

</div>

</section>


<!-- Footer -->

<section id="footer">

<div class="inner">

<header>

<h2>Get in Touch</h2>

</header>

<form method="post" action="#">

<div class="field half first">

<label for="name">Name</label>

<input type="text" name="name" id="name" />

</div>

<div class="field half">

<label for="email">Email</label>

<input type="text" name="email" id="email" />

</div>

<div class="field">

<label for="message">Message</label>

<textarea name="message" id="message" rows="6"></textarea>

</div>

<ul class="actions">

<li><input type="submit" value="Send Message" class="alt" /></li>

</ul>

</form>

<div class="copyright">

&copy; Untitled Design: <a href="">JNBCS</a>. Images <a href="https://unsplash.com/">Unsplash</a>

</div>

</div>

</section>


<!-- Scripts -->

<script src="assets/js/jquery.min.js"></script>

<script src="assets/js/skel.min.js"></script>

<script src="assets/js/util.js"></script>

<script src="assets/js/main.js"></script>


</body>

</html>



Labels:

Comments

Post a Comment

Popular posts from this blog

How to write a blog article

  Writing a blog article can be a lot of work, but it doesn't have to be! In this article, we'll outline 10 points you should keep in mind when writing your next article. Topics include: Researching the topic you want to write about, structuring your article so that it flows from point to point, and what form your writing should take. How to write a blog article - Be sure to include a hook or question to keep readers engaged - Include the following: introduction, body and conclusion - A good article should be between 400 and 700 words in length and every 100 words should cover one point What you need to know about writing articles I’ve put together a list of the things you need to know about writing articles, so that your blog can be as successful as possible.  1)  2)  3)  4)  5) How to save time when writing blog posts I recently discovered a new tool for writing blog posts. It doesn't matter if it's about daily tasks, blog article ideas, or a classroom as...
Post a Comment
Read more

How Often Should I Replace My Toothbrush?

  When was once the ultimate age ye changed you toothbrush?   We throwing oversea expired foods, restock nutritional vitamins or supplements, or replace our beauty products often, however now such comes in conformity with fitness or beauty, it’s our dental hygiene up to expectation doesn’t reach as like a great deal interest yet concept so mean areas about our regimen. However, in that place are necessary regulations then hints ye should comply with for preserving ideal dental health. When To Change Your Toothbrush Most dentists, then the America Dental Association (ADA), advocate altering your toothbrush each and every 3 months. Overtime, toothbrushes continue through normal put on yet tear and turn out to be less fine including doing away with plaque out of enamel then gums. Studies have discovered so much round 3 months is so the bristles break beneath or lapse effectiveness. One sordid deliberation we don’t typically think respecting (and likely don’t as in imitation of s...
Post a Comment
Read more

What document is required for loan?

  Min Document required for personal Loan If your Salary Personal Aadhar Card Pan Card Mail Id Mobile Number Last Three Months Salary Slip One Years to till of Bank Statement Own house Proof 2 Referance If You Are Self Employed Document Required Aadhar Card Pan Card Mail Id Mobile Number Last Three Year Itr with  Financle One Years Bank Statement 2 Referance Just Call 9911681113 Only for Pan India
Post a Comment
Read more