如何在css和html中製作這樣的標題

Question

我希望它的左側有一個個人資料圖片，右側有一個黑色邊框。我需要在左側的另一張圖片左側邊框，我希望我的標誌在中間。圖片大小爲82像素×82像素，整個標題爲100％×82像素。你可以在html和css中爲我寫這個嗎？

這裏它的知情同意，我希望它看起來像 http://s1167.photobucket.com/user/unlivedgears/media/image-10.jpg.html

Answer 1

HTML

<div id="header"> 
<div id="profile_picture"> 
    <img src="profile_picture.jpeg" alt="Profile Picture" height="82" width="82" /> 
</div> 
<div id="another_picture"> 
    <img src="another_picture.jpeg" alt="Another Picture" height="82" width="82" /> 
<div> 
<div id="logo"> 
    <img src="logo.jpeg" alt="Logo" height="X" width="Y" /> 
</div> 
</div> 

CSS

* 
{ 
padding: 0; 
margin: 0; 
border: 0; 
} 

div#header 
{ 
height: 82px; 
width: 100%; 
overflow: auto; 
} 

div#profile_picture 
{ 
float: left; 
border-right: Xpx; 
} 

div#another_picture 
{ 
float: left; 
border-left: Xpx; 
} 

div#logo 
{ 
float: right; 
width: Xpx; 
height: Xpx; 
} 

Answer 2

HTML

<div class="header"> 
    <div class="img l"></div> 
    <div class="img r"></div> 
    <div class="img logo"></div> 
</div> 

CSS

.header{ 
    background:red; 
    width:100%; 
} 

.img{ 
    width:50px; 
    height:50px; 
    background:blue; 
} 

div.l{ 
    float:left; 
    border-right:5px solid black; 
} 

div.r{ 
    float:right; 
    border-left:5px solid black; 
} 

div.logo{ 
    width:200px; 
    margin:0 auto; 
} 

看到這裏的工作例如：http://jsfiddle.net/sDVGc/