Wednesday, October 1, 2014

1.3 services

Coding of Services Page  :-

Header



Header is Divided into Two Parts

1.       Logo
2.       Menubar

Coding Part:

<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation | Welcome</title>
<link rel="stylesheet" href="css/foundation.css" />
<link rel="stylesheet" href="css/style.css" />
<script src="js/vendor/modernizr.js"></script>
</head>
<body>

<!-- This is Border Class  -->

<div class="row border">
<div class="large-12">
<!-- This is the Logo  -->
<div class="row">
<div class="large-12">
<div class="large-4 columns">
<img src="img/logo.png">
</div>  <!—Logo Div Close-->

<!-- This is the Menu Bar -->
<div class="large-8 columns">
<nav class="top-bar" data-topbar role="navigation">
<section class="top-bar-section">

<!-- Left Nav Section -->
<ul class="left">
<li><a href="home.html">Home</a></li>
<li><a href="Aboutus.html">About us</a></li>
<li><a href="Services.html">Services</a></li>
<li><a href="Potfolio.html">Portfolio</a></li>
<li><a href="Contactus.html">Contact us</a></li>
</ul>
</section>
</nav>
</div>    <!--Menu Bar Div Close-->
</div<!--Class-12 Div Close-->
</div<!-- Row Div Close-->



<!—Services Part us Banner-->





<!--Coding  -->

<div class="row">
<div class="large-12 columns">
<div class="myabout">
<h3>Services</h3>
</div>
</div<!--Div of Large-12  Closed-->
</div> <!--Div of Row is Closed-->


<!—Content Part Of Services Page-->






<!--  Coding of Content Part -->

<div class="row paragraph">
<div class="large-12">
<div class="large-3 columns">
<div class="cont1">
<b>Mechanical</b><br><br>
<img src="img/arrow.png">&nbsp HVAC system</img><br>
<img src="img/arrow.png">&nbsp Plumbing System </img><br>
<img src="img/arrow.png">&nbsp Speciality piping</img><br>
</div<!--  Coding of Content Part -->
</div <!—Div of Large-3 Closed -->

<div class="large-5 columns">
<div class="slide">
<ul class="example-orbit" data-orbit>
<li>
<img src="img/about.png" alt="slide 1" />
<div class="orbit-caption">
Caption One.
</div>
</li>  <!--Li Part of 1st Image of Slider Closed-->

<li class="active">
<img src="img/about.png" alt="slide 2" />
<div class="orbit-caption">
Caption Two.
</div>
</li> <!--Li Part of 2nd  Image of Slider Closed-->

<li>
<img src="img/about.png" alt="slide 3" />
<div class="orbit-caption">
Caption Three.
</div>
</li> <!--Li Part of 3rd Image of Slider Closed-->
</ul> <!—Ul Tag is Closed-->
</div><!—Div of Large-3 Closed -->
</div> <!--Div of Large- 5 Columns Closed -->



<div class="large-4 columns">
<h5>
<b>Have a question?<b>
</h5>

<h6>Your name (required) </h6>
<input type="text" name="text" value=" ">
<h6>Your email (required) </h6>

<input type="text" name="text" value=" ">

<h6>Subject  </h6>
<input type="text" name="text" value=" ">
<textarea rows="6" cols="40"></textarea>
<input class="send" type="button" value="send">
</div>><!—Div of Large-4 Closed -->
</div>><!—Div of Row Closed -->
</div>><!—Div of Row Paragraph Closed -->


Footer



<!—Coding of the Footer Part-->

<div class="row">
<div class="large-12 columns">
<nav class="top-bar" data-topbar role="navigation">
<section class="top-bar-section">
<!-- Left Nav Section -->
<div class="myfooter">
<ul class="right">
<li><a href="home.html">Home</a></li>
<li><a href="Aboutus.html">About us</a></li>
<li><a href="Services.html">Services</a></li>
<li><a href="Potfolio.html">Portfolio</a></li>
<li><a href="Contactus.html">Contact us</a></li>
</ul> <!— Ul tag of menubar Part at Footer has been Closed  -->
</div>
</section>
</nav>
</div>  <!—Large-12  Div Close-->
</div>  <!—Row Div Close-->
</div<!—Large-12 Border  Div Close-->
</div<!—Row Border Div Close-->
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation.min.js"></script>
<script>
$(document).foundation();
</script>
</body>              <!—Tag of Body Part has been End Here -->
</html>                               <!--Tag of Body Part has been End Here -->



No comments: