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>
<a href="index.php" id="menu">Download</a>
<a href="index.php" id="menu">Contact Us</a>
<a href="index.php" id="menu">About Us</a>
<a href="index.php" id="menu">Feedback</a>
<a href="index.php" id="menu">Login</a>
<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>
<a href="index.php" id="futter">Contact Us</a>
<a href="index.php" id="futter">About Us</a>
<br>©Develop And Design By Tank Vijay
</div>
</td>
</tr>
</table>
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>
<a href="index.php" id="menu">Download</a>
<a href="index.php" id="menu">Contact Us</a>
<a href="index.php" id="menu">About Us</a>
<a href="index.php" id="menu">Feedback</a>
<a href="index.php" id="menu">Login</a>
<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>
<a href="index.php" id="futter">Contact Us</a>
<a href="index.php" id="futter">About Us</a>
<br>©Develop And Design By Tank Vijay
</div>
</td>
</tr>
</table>
No comments:
Post a Comment