Create Website Using Only HTML:-
outputs:-
 |
Home
|
 |
| About us |
 |
| Services |
 |
| Skills |
 |
| Portfolio View |
 |
| Our Team |
 |
| Contact Us |
 |
| Footer |
<!DOCTYPE html>
<html>
<head>
<title>Website in Table</title>
<!-- for font icons -->
<link rel="stylesheet" type="text/css"
href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body style="margin:0">
<!-- Start Header -->
<table border="0" width="100%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td>
<table border="0" width="95%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td>
<font face="arial" color="black" size="7">
<strong>Ghanshyam</strong>
</font>
</td>
<td width="30%"> </td>
<td><a href="#home">
<font face="arial" color="#ffffff" size="5">
Home
</font>
</a>
</td>
<td><a href="#about">
<font face="arial" color="#ffffff" size="5">
About
</font>
</a>
</td>
<td><a href="#services">
<font face="arial" color="#ffffff" size="5">
Services
</font>
</a>
</td>
<td><a href="#portfolio">
<font face="arial" color="#ffffff" size="5">
Portfolio
</font>
</a>
</td>
<td><a href="#team">
<font face="arial" color="#ffffff" size="5">
Team
</font>
</a>
</td>
<td><a href="#contact">
<font face="arial" color="#ffffff" size="5">
Contact
</font>
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- End Header -->
<!-- Start Home -->
<table border="0" id="home" width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" height="300">
<h3>
<marquee behavior="alternate" direction="left" scrollamount="2">
<font face="arial" color="#3d4452" size="7">
Hi, I'm Ghanshyam Das
</font>
</marquee>
</h3>
<h1>
<marquee behavior="alternate" direction="right" scrollamount="2">
<font face="arial" color="#6b48ff" size="9">
Frontend Developer
</font>
</marquee>
</h1>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- End Home -->
<!-- Start About -->
<table border="0" id="about" width="100%" cellpadding="0" cellspacing="0" bgcolor="#3d4452">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="100" align="center" valign="middle" colspan="2">
<font face="arial" size="6" color="#ffffff">
About
</font>
<hr width="70" color="#ffffff">
</td>
</tr>
<!-- Heading End-->
<tr>
<td width="30%">
<img src="images/ghanshyam das.png" width="100%" alt="me" />
</td>
<td width="65%" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td height="40">
<font face="arial" size="4" color="#0be6af">
Hi, I'm Ghanshyam Das
</font>
</td>
</tr>
<tr>
<td>
<font face="arial" size="5" color=" #ffffff">
Frontend Developer based in New Delhi
</font>
</td>
</tr>
<tr>
<td>
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
<hr noshade>
<br />
<button type="button">
<font face="arial" size="5">
Download CV
</font>
</button>
<button type="button">
<font face="arial" size="5">
Hire Me
</font>
</button>
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="60" colspan="2">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End About -->
<!-- Start Services -->
<table border="0" id="services" width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="160" align="center" valign="middle" colspan="3">
<font face="arial" size="6" color="black">
Services
</font>
<hr width="70" color="black">
</td>
</tr>
<!-- Heading End-->
<tr>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-laptop"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Web Development
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-mobile"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Responsive Design
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-pencil"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Creative Design
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-code"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Clean Code
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-support"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Fast Support
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" align="center" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="middle" bgcolor="#6b48ff" height="190">
<font size="6" color="#ffffff">
<span class="fa fa-rocket"></span>
</font>
<br />
<br />
<font size="5" color="#ffffff" face="arial">
Branding Identity
</font>
<br />
<p>
<font face="arial" size="3" color="#c2c0c3">
Lorem ipsum dolor sit amet, ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi.
</font>
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="60" colspan="3">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End Services -->
<!-- Start Skills -->
<table border="0" width="100%" cellpadding="0" cellspacing="0" bgcolor="#353535">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="160" align="center" valign="middle" colspan="2">
<font face="arial" size="6" color=" #ffffff">
Skills
</font>
<hr width="70" color="#ffffff">
</td>
</tr>
<!-- Heading End-->
<tr>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
Html5
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
80%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="80%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
Css3
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
40%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="40%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
Javascript
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
67%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="67%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
Php
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
70%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="70%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
Java
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
90%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="90%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="50%" height="100" valign="top">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="left" valign="top" height="40">
<font face="arial" size="5" color=" #ffffff">
React
</font>
</td>
<td align="right" valign="top" height="40">
<font face="arial" size="5" color=" #c2c0c3">
33%
</font>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#292929" align="left">
<table border="0" width="33%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td height="10"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="10" colspan="2">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End Skills -->
<!-- Start Portfolio -->
<table border="0" id="portfolio" width="100%" cellpadding="0" cellspacing="0" bgcolor="#6b48ff">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="160" align="center" valign="middle" colspan="3">
<font face="arial" size="6" color=" #ffffff">
Portfolio
</font>
<hr width="70" color="#ffffff">
</td>
</tr>
<!-- Heading End-->
<tr>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Web Design
</font>
<br /><br />
<img src="images/1.jpg" width="100%" />
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Branding
</font>
<br /><br />
<img src="images/2.jpg" width="100%" />
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Graphic Design
</font>
<br /><br />
<img src="images/3.jpg" width="100%" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Web Design
</font>
<br /><br />
<img src="images/4.jpg" width="100%" />
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Graphic Design
</font>
<br /><br />
<img src="images/5.jpg" width="100%" />
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<font face="arial" size="5" color="#ffffff">
Project Title Here
</font>
<br />
<br />
<font face="arial" size="4" color="#0be6af">
Web Design
</font>
<br /><br />
<img src="images/6.jpg" width="100%" />
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="60" colspan="3">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End Portfolio -->
<!-- Start Team -->
<table border="0" id="team" width="100%" cellpadding="0" cellspacing="0" bgcolor="#3d4452">
<tr>
<td>
<table border="0" width="70%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="120" align="center" valign="middle" colspan="3">
<font face="arial" size="6" color="#ffffff">
Team
</font>
<hr width="50" color="#ffffff">
</td>
</tr>
<!-- Heading End-->
<tr>
<td width="30%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#292929">
<tr>
<td>
<img src="images/riya.jpg" width="100%" alt="team" />
<br /><br />
<font face="arial" size="5" color="#ffffff">
Riya Sharma
</font>
<br /><br />
<font face="arial" size="4" color="#0be6af">
UI/UX Designer
</font>
</td>
</tr>
</table>
</td>
<td width="30%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#292929">
<tr>
<td>
<img src="images/monu.jpg" width="100%" alt="team" />
<br /><br />
<font face="arial" size="5" color="#ffffff">
Monu Gupta
</font>
<br /><br />
<font face="arial" size="4" color="#0be6af">
Motion Designer
</font>
</td>
</tr>
</table>
</td>
<td width="30%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#292929">
<tr>
<td>
<img src="images/prateek.jpg" width="100%" alt="team" />
<br /><br />
<font face="arial" size="5" color="#ffffff">
Prateek Jain
</font>
<br /><br />
<font face="arial" size="4" color="#0be6af">
Social Media Manager
</font>
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="60" colspan="3">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End Team -->
<!-- Start Contact -->
<table border="0" id="contact" width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<!-- Heading Start-->
<tr>
<td height="160" align="center" valign="middle">
<font face="arial" size="6" color="#3d4452">
Contact
</font>
<hr width="70" color="#3d4452">
</td>
</tr>
<!-- Heading End-->
<tr>
<td align="center" valign="top">
<table border="0" width="55%" cellpadding="20" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td>
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center"
bgcolor="#353535">
<tr>
<td width="30%">
<font face="arial" size="4" color="#ffffff">
Name
</font>
</td>
<td width="70%">
<input type="text" size="50">
</td>
</tr>
<tr>
<td width="30%">
<font face="arial" size="4" color="#ffffff">
Email
</font>
</td>
<td width="70%">
<input type="text" size="50">
</td>
</tr>
<tr>
<td width="30%">
<font face="arial" size="4" color="#ffffff">
Subject
</font>
</td>
<td width="70%">
<input type="text" size="50">
</td>
</tr>
<tr>
<td width="30%">
<font face="arial" size="4" color="#ffffff">
Message
</font>
</td>
<td width="70%">
<textarea cols="51" rows="4"></textarea>
</td>
</tr>
<tr>
<td width="30%">
</td>
<td width="70%">
<button type="submit">
<font size="5" face="arial">Send Message</font>
</button>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- section padding bottom -->
<tr>
<td height="60">
</td>
</tr>
<!-- section padding bottom End-->
</table>
</td>
</tr>
</table>
<!-- End Contact -->
<!-- Start Footer -->
<table border="0" width="100%" cellpadding="0" cellspacing="0" bgcolor="#353535">
<tr>
<td>
<table border="0" width="85%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="top">
<font color="#3b5999" size="10">
<span class="fa fa-phone"></span>
</font>
<br /><br />
<font color="#ffffff" size="5" face="arial">
Phone No
</font>
<p>
<font color="#c2c0c3" size="3" face="arial">
+91 9999955555
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="top">
<font color="#3b5999" size="10">
<span class="fa fa-envelope"></span>
</font>
<br /><br />
<font color="#ffffff" size="5" face="arial">
Email
</font>
<p>
<font color="#c2c0c3" size="3" face="arial">
yourid@gmail.com
</font>
</p>
</td>
</tr>
</table>
</td>
<td width="33.33%" valign="top">
<table border="0" width="100%" cellpadding="15" cellspacing="0" align="center">
<tr>
<td align="center" valign="top">
<font color="#3b5999" size="10">
<span class="fa fa-map-marker"></span>
</font>
<br /><br />
<font color="#ffffff" size="5" face="arial">
Location
</font>
<p>
<font color="#c2c0c3" size="3" face="arial">
Sec-90,Kalka Ji Mandir, Greater Kailash, New
Delhi 110020
</font>
</p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="3">
<hr noshade>
</td>
</tr>
<tr>
<td colspan="3" height="100" valign="top">
<table border="0" width="30%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="25%" align="center">
<table border="0" width="50" cellpadding="0" cellspacing="0" align="center"
height="50" bgcolor="#0be6af">
<tr>
<td align="center" valign="middle">
<a href="">
<font size="5" color="#ffffff">
<span class="fa fa-facebook"></span>
</font>
</a>
</td>
</tr>
</table>
</td>
<td width="25%" align="center">
<table border="0" width="50" cellpadding="0" cellspacing="0" align="center"
height="50" bgcolor="#0be6af">
<tr>
<td align="center" valign="middle">
<a href="">
<font size="5" color="#ffffff">
<span class="fa fa-skype"></span>
</font>
</a>
</td>
</tr>
</table>
</td>
<td width="25%" align="center">
<table border="0" width="50" cellpadding="0" cellspacing="0" align="center"
height="50" bgcolor="#0be6af">
<tr>
<td align="center" valign="middle">
<a href="">
<font size="5" color="#ffffff">
<span class="fa fa-linkedin"></span>
</font>
</a>
</td>
</tr>
</table>
</td>
<td width="25%" align="center">
<table border="0" width="50" cellpadding="0" cellspacing="0" align="center"
height="50" bgcolor="#0be6af">
<tr>
<td align="center" valign="middle">
<a href="">
<font size="5" color="#ffffff">
<span class="fa fa-google-plus"></span>
</font>
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- End Footer -->
</body>
</html>
No comments:
Post a Comment