سلام
من می خوام با div سایت خودم رو به شکل زیر در بیارم....
ولی متاسفانه div طوری تنظیم نمیشه که خبر سایت بیاد دقیقا وسط سایت(سر جای خودش) و به شکل زیر در میاد...
کد های سایت من به شکل زیر هستش
کد css
حالا می خواستم بدونم باید چیکار کنم که قسمت وسطی بیاد سر جاش
با تشکر
من می خوام با div سایت خودم رو به شکل زیر در بیارم....
ولی متاسفانه div طوری تنظیم نمیشه که خبر سایت بیاد دقیقا وسط سایت(سر جای خودش) و به شکل زیر در میاد...
کد های سایت من به شکل زیر هستش
کد:
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="css-layout.css" rel="stylesheet" type="text/css" />
<title>Untitled 1</title>
</head>
<body>
<div id="main">
<div id="header">
</div>
<div id="login"></div>
<div id="statusbar"></div>
<div id="body">
<div id="block">
<div id="block1">
<div id="block1_header">
</div>
<div id="block1_body">
</div>
<div id="block1_footer">
</div>
</div>
<div id="block2">
<div id="block2_header">
</div>
<div id="block2_body">
</div>
<div id="block2_footer">
</div>
</div>
</div>
<div id="titr">
<div id="titr1"></div>
<div id="titr2"></div>
<div id="titr3"></div>
</div>
</div>
<div id="footer">
<div id="footer_top"></div>
<div id="footer_down"></div>
</div>
</div>
</body>
</html>کد css
کد:
/* CSS layout */
#header{
width:998px;
height:164px;
background-color:blue;
background-image:url('images/header.jpg');
word-wrap:break-word ;
}
#main{
width:998px;
word-wrap : break-word ;
}
#login{
height:41px;
background-color:aqua;
background-image:url('images/login.jpg');
word-wrap:break-word ;
}
#statusbar{
height:40px;
background-color:black;
background-image:url('images/statusbar.jpg');
word-wrap:break-word ;
}
#footer_down{
height:36px;
background-color:fuchsia;
background-image:url('images/footer_down.jpg');
word-wrap:break-word ;
}
#footer_top{
height:57px;
background-color:gray;
background-image:url('images/footer_top.jpg');
word-wrap:break-word ;
}
#block{
width:235px;
background-color:green;
word-wrap:break-word ;
}
#block1_header{
width:235px;
height:35px;
background-color:lime;
background-image:url('images/header_block.jpg');
word-wrap:break-word ;
}
#block1_body{
background-color:maroon;
height:30px;
background-image:url('images/bg_block.jpg');
word-wrap:break-word ;
}
#block1_footer{
background-color:navy;
background-image:url('images/footer_block.jpg');
height:16px;
word-wrap:break-word;
}
#block2{
width:235px;
background-color:olive;
word-wrap:break-word ;
}
#block2_header{
width:235px;
height:35px;
background-color:orange;
background-image:url('images/header_block.jpg');
word-wrap:break-word ;
}
#block2_body{
background-color:purple;
height:30px;
background-image:url('images/bg_block.jpg');
word-wrap:break-word ;
}
#block2_footer{
background-color:red;
height:16px;
background-image:url('images/footer_block.jpg');
word-wrap:break-word ;
}
#titr{
width:763px;
word-wrap:break-word;
}
#titr1{
background-color:silver;
height:18px;
width:763px;
background-image:url('images/header_body.jpg');
word-wrap:break-word;
}
#titr2{
background-color:teal;
height:18px;
width:763px;
background-image:url('images/bg_body.jpg');
word-wrap:break-word;
}
#titr3{
background-color:yellow;
height:18px;
width:763px;
background-image:url('images/footer_body.jpg');
word-wrap:break-word;
}با تشکر
آخرین ویرایش:
