Coding of Portfolio
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-->
<!—Portfolio 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 Portfolio Page-->
<!-- Coding of Content Part -->
<div class="row paragraph">
<div
class="large-12 columns">
<div
class="myport">
<div
class="large-4 columns">
<img src="img/p1.PNG" /><br /><br /><br
/>
<img src="img/p2.PNG" /><br /><br /><br
/>
<img src="img/p3.PNG" /><br /><br /><br
/>
<img src="img/p1.PNG" /><br /><br /><br
/>
<img src="img/p2.PNG" /><br /><br /><br
/>
<img src="img/p3.PNG" />
</div><!--Div of Large-4 Closed-->
<div
class="large-4 columns">
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p>
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p>
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p>
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p><br><br>
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p><br><br>
<h2>Learn More</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text ever since
the 1500s,
</p>
</div>><!--Div of Large-4 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 Myport Closed-->
</div>><!--Div of Large-12 Closed-->
</div>><!--Div of Rowparagraph 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:
Post a Comment