// Make a file index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Web Page</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
</head>
<body>
<div class="main"> <!--Main Start-->
<div class="header"> <!--Header Start-->
<h1>Header</h1>
</div> <!--Header End-->
<div class="contentarea"> <!--Contentarea Start-->
<div class="leftside_contentarea"> <!--Leftside Content Area Start-->
<h1>Leftside Content Area</h1>
</div> <!--leftside Content Area End-->
<div class="rightside_contentarea"> <!--Rightside Content Area Start-->
<h1>Rightside Content Area</h1
></div> <!--Rightside Content Area End-->
</div> <!--Contentarea End-->
<div class="footer"> <!--Footer Start-->
<h1>Footer</h1
></div> <!--Footer End-->
</div> <!--Main End-->
</body>
</html>
//Make a file css.php
* {
margin:0px;
padding:0px;
}
img {
border: 0px;
}
body {
background-color:#deddc2;
}
.main {
margin:0 auto;
height:960px;
width: 1060px;
background-color:#f2f2e9;
-moz-box-shadow: 0 0 20px #454545;
-webkit-box-shadow: 0 0 20px #454545;
box-shadow: 0 0 20px #454545;
}
.header {
height:168px;
background:#c52f38;
}
.contentarea {
height:590px;
background:#d2d3d5;
margin-top:10px;
}
.leftside_contentarea {
width:270px;
float:left;
height:590px;
background:#C03;
}
.rightside_contentarea {
height:590px;
float:right;
width:790px;
background:#030;
}
.footer {
height:170px;
width:1060px;
background:#FF0;
margin-top:10px;
float:left;
}
3 comments:
Good Description of DIV concept....really helpful
This is very useful things for me to make me a good web developer.
trgood information .....for a good developer
Post a Comment