具有其他元素的元素

Question

所以我有一个标题，我不确定应该如何编码应该略低于它的三个元素框，但仍然在末尾，如下图所示：

的一种方式，也许是位置绝对和边距，或者也许我应该切片图像，所以盒子的顶部与标头背景图片...

.box { 
    position: absolute; 
    margin-top: -30px; 
} 

或者我应该怎么做？

Answer 1

下次您应该发布一些您已经尝试过的代码。根据我更好的判断，我做出了你所画的。

http://jsfiddle.net/xD69h/

HTML：

<div id="a"> 
<span id="a-text">A</span> 
<div id="b"> 
    <span id="b-text">B</span> 
</div> 
<div id="c"> 
    <span id="c-text">C</span> 
</div> 
</div> 

CSS：

#a { 
width: 100%; 
height: 150px; 
background-color: #EFE4B0; 
border: 3px solid #FFABCA; 
color: #B97A57; 
} 
#a-text { 
float: left; 
} 
#b { 
width: 200px; 
height: 150px; 
background-color: #7092BE; 
border: 4px solid black; 
border-radius: 5px; 
color: #B97A57; 
float: left; 
margin-top: 50px; 
margin-left: 50px; 
} 
#c { 
width: 200px; 
height: 150px; 
background-color: #B97A57; 
border: 4px solid #B97A57; 
color: white; 
float: left; 
margin-top: 50px; 
}