邊距忽略頂部，右側和底部CSS，HTML

我有一個跨度單詞'你好'在裏面，一個高度爲100px的div內。我試圖將跨度，頂部，左側，右側和底部的邊距分配爲50px，但由於某種原因，它只在邊距的左側分配了50px的邊距。我不知道我做錯了什麼。請看看我的代碼：邊距忽略頂部，右側和底部CSS，HTML

test.php的

<style> 

div { 
border: 1px solid red; 
height: 100px; 
} 

span { 
border: 1px solid blue; 
margin: 50px; 
} 

</style> 

<div> <span> Hello </span> </div>

來源

2015-06-28 frosty

添加顯示：塊到你的CSS跨度

CSS

span { 
display:block; 
border: 1px solid blue; 
margin: 60px; 
}

UPDATE

如果你在這裏給出寬度，它仍然可以工作，但是可以確保你有足夠的空間來滿足跨度：60px;會拋出60px左邊。

div { 
 
    border: 1px solid red; 
 
    height: 100px; 
 
    width: 200px; 
 

 
} 
 
span { 
 
    display: block; 
 
    border: 1px solid blue; 
 
    margin: 60px; 
 
    width: 50px; /* You could also set here or just leave it*/ 
 
}

<div> 
 

 
    <span> Hello </span> 
 

 
</div>

來源

2015-06-28 19:49:57 divy3993

如果我調整div的寬度，則不起作用。 – frosty

@frosty是的，我會去與德米特里。你也可以添加display：inline-block，這取決於你的要求 – divy3993

@frosty現在對你有用嗎？ – divy3993

div { 
 
    border: 1px solid red; 
 
    height: 100px; 
 
} 
 
span { 
 
    border: 1px solid blue; 
 
    margin: 50px; 
 
    display: block; 
 
}

<div> 
 
    <span> Hello </span> 
 
</div>

你要的span的display屬性更改爲inline-block或block或使用任何block元素來實現相同的。我已將display屬性span更改爲block

來源

2015-06-28 19:51:24

邊距忽略頂部，右側和底部CSS，HTML

回答

相關問題