html - css 布局标题

Question

我是网页设计的新手，我认为我掌握了如何制作布局的想法。我很难在我的布局中正确定位图像以制作正确的标题。

张贴的图片是我想要实现的。我发布了我写的完全错误的代码。任何帮助表示赞赏! -谢谢

http://img220.imageshack.us/img220/7097/helpcopy.jpg )

HTML

<div id="container">
    <div id= "header">
        <div id="leftimage">
            <img src="images/1.jpg" alt="" width="604" height="85" />
        </div>

        <div id ="rightimage">
                <div id="verticalimage">
                    <img src="images/2.jpg" alt="" width="29" height="85" />
                </div>
                <div id="horizontalimages">
                    <img src="images/3.jpg" alt="" width="182" height="32" />
                    <img src="images/4.jpg" alt="" width="182" height="22" />
                    <img src="images/5.jpg" alt="" width="182" height="31" />
                </div>
        </div>
    </div>
</div>

CSS

body{
background: white;
font-family: Arial, Helvetica, sans-serif;
color:#7d806c;
font-weight: bold;
}

#container{
width: 1000px;
margin:0 auto;
outline: 1px dashed red;
}
#leftimage{
width:604;
height: 85;
float: left;
}
#rightimage{
width: 211; 
height: 85;
float: right;
margin: 25px 0 0 0;


}
#verticalimage{
width:29;
height:85;
float:left;

}
#horizontalimages{
width:182;
height:85;
float: right;
}

Answer 1

页眉没有样式，因此无法正确对齐 div。并且“水平图像”类中缺少 px。在您的 CSS 中添加以下样式

#header {position:relative; background-color:#FFF} 
#horizontalimages{width:182px; height:85px; float: right;}