amin7x
شنبه 07 اردیبهشت 1392, 20:47 عصر
سلام ببخشید من توی inline کردن این چنتا Div ی که به صورت کامنت در آوردم مشکل دارم.
ممنون میشم کمکم کنید.
کد HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>London Tourist</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="main">
<div id="head">
<div id="skyview">
<div class="bgtexthead">
<!--
<div class="box1">
<div class="boxtitle">Where</div>
<p class="box">The South East of England is home to some of the best restaurant eating venues in the country.</p>
From traditional to international, the restaurant eating venues of South East of England are sure to provide you with more than enough to keep you satisfied on your next break away.</div>
<div class="box2">
<div class="boxtitle">What</div>
<p class="box">Things to do.</p>
Days out in England with that special someone ...</div>
<div class="box3">
<div class="boxtitle">How</div>
<p class="box"></p>
The South East i packed full of...</div>
<div class="box4">
<div class="boxtitle">Search</div>
<p class="box"></p>
The South East i packed full of...</div>
-->
</div>
</div>
</div>
<div class="centerbody"> </div>
<div class="footer">
<div class="footerimg"></div>
</div>
</div>
</body>
</html>
و کد CSS:
@charset "utf-8";
body {
background-color: #fff585;
}
#main {
width: 1000px;
height: auto;
border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
-webkit-border-radius: 10px;
}
#head {
width: 1000px;
height: 478px;
}
#skyview {
height: 470px;
width: 513px;
background-image: url(../images/SkyView.png);
background-position: top right;
background-repeat: no-repeat;
}
.bgtexthead {
padding-top: 178px;
height: 300px;
width: 965px;
background-image: url(../images/BgTextHead.png);
background-position: bottom;
background-repeat: no-repeat;
}
.boxtitle {
font-weight: bold;
color: #FFF;
font-size: 16px;
}
.box {
color: #fbf183;
font-weight: bold;
}
.bgtexthead .box1 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 70px 50px;
}
.bgtexthead .box2 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.bgtexthead .box3 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.bgtexthead .box4 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.centerbody{
width:960px;
height:300px;
background-color:#ffffff;
}
.footer{
width:960px;
height:auto;
background-color:#ede57c;
}
.footerimg{
width:960px;
height:300px;
background-image: url(../images/londonfooter.png);
background-position: bottom;
background-repeat: no-repeat;
}
ممنون میشم کمکم کنید.
کد HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>London Tourist</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="main">
<div id="head">
<div id="skyview">
<div class="bgtexthead">
<!--
<div class="box1">
<div class="boxtitle">Where</div>
<p class="box">The South East of England is home to some of the best restaurant eating venues in the country.</p>
From traditional to international, the restaurant eating venues of South East of England are sure to provide you with more than enough to keep you satisfied on your next break away.</div>
<div class="box2">
<div class="boxtitle">What</div>
<p class="box">Things to do.</p>
Days out in England with that special someone ...</div>
<div class="box3">
<div class="boxtitle">How</div>
<p class="box"></p>
The South East i packed full of...</div>
<div class="box4">
<div class="boxtitle">Search</div>
<p class="box"></p>
The South East i packed full of...</div>
-->
</div>
</div>
</div>
<div class="centerbody"> </div>
<div class="footer">
<div class="footerimg"></div>
</div>
</div>
</body>
</html>
و کد CSS:
@charset "utf-8";
body {
background-color: #fff585;
}
#main {
width: 1000px;
height: auto;
border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
-webkit-border-radius: 10px;
}
#head {
width: 1000px;
height: 478px;
}
#skyview {
height: 470px;
width: 513px;
background-image: url(../images/SkyView.png);
background-position: top right;
background-repeat: no-repeat;
}
.bgtexthead {
padding-top: 178px;
height: 300px;
width: 965px;
background-image: url(../images/BgTextHead.png);
background-position: bottom;
background-repeat: no-repeat;
}
.boxtitle {
font-weight: bold;
color: #FFF;
font-size: 16px;
}
.box {
color: #fbf183;
font-weight: bold;
}
.bgtexthead .box1 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 70px 50px;
}
.bgtexthead .box2 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.bgtexthead .box3 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.bgtexthead .box4 {
width: 178px;
height: 209px;
font-size: 13px;
padding: 10px 50px;
}
.centerbody{
width:960px;
height:300px;
background-color:#ffffff;
}
.footer{
width:960px;
height:auto;
background-color:#ede57c;
}
.footerimg{
width:960px;
height:300px;
background-image: url(../images/londonfooter.png);
background-position: bottom;
background-repeat: no-repeat;
}