<style>*{ margin: 0; padding: 0;}.clearfix:after{ content: ""; display:block; height: 0; overflow: hidden;? clear: both;}.clearfix{ *zoom:1;} ?.left{ width: 214px; height: 192px; border: 3px solid red; margin:10px;}.left_in{ width: 208px; height: 186px; border: 3px solid #ccc ;}.left_in h2{ background: url(imgs/left_title2.png) no-repeat center right; font-size: 14px; width:206px; height: 33px; line-height: 33px; border-bottom: 1px dotted #CBCBCB; border: 1px solid red;}.left_in h2 span{ display: block; background: url(imgs/left1.png) no-repeat center;? height:33px; width:25px; margin-right: 20px; border: 1px solid red; float:left;}</style></head><body> <div class='left'> <div class="left_in"> <h2 class="clearfix"><span></span>標(biāo)題</h2> 內(nèi)容 </div> </div> </body></html>顯示的是1.為什么“內(nèi)容“不是在下面靠左邊的位置呢,2.(1).當(dāng)我把.left_in h2 span里的display:block換成display:inline-block,去掉float:left時(shí),就會(huì)出現(xiàn)"標(biāo)題"下沉的情況,但‘內(nèi)容’就正常了,顯示是:(2).當(dāng)把h2中的height去掉,只保留line-height:33px;時(shí),h2就變寬了,就會(huì)出現(xiàn)這種情況(3).當(dāng)設(shè)置h2的margin-top:-5px;時(shí),也不行。出現(xiàn)如下應(yīng)該怎樣寫才能讓”標(biāo)題“出現(xiàn)在藍(lán)色條的中間,內(nèi)容也能正??孔筮咃@示呢。大神幫幫忙!
4 回答

玩意11
TA貢獻(xiàn)14條經(jīng)驗(yàn) 獲得超10個(gè)贊
.left_in h2 {
??? background: url(imgs/left_title2.png) no-repeat center right;
??? font-size: 14px;
??? width: 206px;
??? height: 33px;
??? line-height: 33px;
??? border-bottom: 1px dotted #CBCBCB;
??? border: 1px solid red;
}
把高度height:33px;去掉就好了

阿賈大魔王
TA貢獻(xiàn)29條經(jīng)驗(yàn) 獲得超28個(gè)贊
寫出來(lái)的效果是這樣:
標(biāo)題在中間,內(nèi)容左邊顯示,希望對(duì)你有幫助,望采納!
添加回答
舉報(bào)
0/150
提交
取消