27 September 2015

Create a simple template with HTML without using table

Create a simple template using HTML but without use of table.Yes,we are not using the table tag for creating Template.


We are using only the div tag and there propertys for creating this template.
In this Template you can put your data on div tag and it will be aligned optometricali.

Just copy this code for create this type of Template.

Code:-

<head>
<title>Welcome To File Sharing</title>
<!-- create a ID for page-->
<style>
#banner
{
background-color:#0066FF;
width:100%;
height:150px;
font-family:"Geneva";
color:#CCCCCC;
}
#futter
{
background-color:#0066FF;
font-family:"Geneva";
color:#FFFFFF;
font-size:24px;
}
#menu
{
background-color:#00FFFF;
color:#000066;
font-family:"Viner Hand ITC";
font-size:20px;
margin-top:2px;
letter-spacing:5;
}
#hormenu
{
background-color:#0099FF;
height:250px;
width:15%;
margin-top:-20px;

}
#body
{
background-color:#0099FF;
height:250px;
width:69.1%;
margin-top:-250px;
margin-left:15.5%;
}
#news
{
background-color:#0099FF;
height:250px;
width:15%;
margin-top:-250px;
margin-left:85%;
}
#table
{
width:100%;
border-color:#00FF00;
border-radius:10,10,20,20;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#000000">
<table id="table">
  <tr>
    <td>
<div id="banner" align="center">
<h1>Welcome To File Sharing</h1>
<h5 style="margin-top:-20px; margin-left:150px; ">Share Your File With Friends.</h5>
</div>
<div id="menu">
<a href="index.php" id="menu">Home</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="menu">Download</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="menu">Contact Us</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="menu">About Us</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="menu">Feedback</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="menu">Login</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<h4 id="menu" align="right" style="margin-top:-25px; "><?php
echo "Date:".date("d/m/y");
?>
</h4>
</div>
<div style=" ">
<div align="left" id="hormenu">



</div>

<div align="center" id="body">



</div>

<div align="right" id="news">
<marquee align="left" behavior="alternate">Latest News</marquee>


</div>
</div>
<br>
<div align="center" id="futter">
<a href="index.php" id="futter">Download</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="futter">Contact Us</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="index.php" id="futter">About Us</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<br>&copy;Develop And Design By Tank Vijay
</div>
</td>
  </tr>
</table>

No comments:

Post a Comment

G20 in India: A Closer Look at the High-Stakes Poker Game

India's Moment in the Spotlight: As the host nation, India has a unique opportunity to shape the G20 agenda and showcase its leadership ...