在CSS中的邊框邊距？

-1

雖然，試圖在網站上創建一個正文border，但我在創建網站和border之間的margin時遇到了麻煩。在CSS中的邊框邊距？

我想在border的周圍有20px的餘量，但我似乎無法弄清楚如何做到這一點，任何人都可以幫助我嗎？

我的最終目標是border看起來接近this。

2015-04-26 Peter Peters

當您提出一個關於您的**代碼**導致的問題的問題時，如果您提供了可供人們用來重現問題的代碼，那麼您將得到更好的答案。該代碼應該是[最小，完整和可驗證]（http://stackoverflow.com/help/mcve）。附：身體邊框與容器邊框不一樣。 – Aziz

只是使周圍適當媒體查詢內容的包裝的div，像這樣

Demo

#wrapper { 
    max-width: 1100px; 
    margin: 20px auto; 
    border:1px solid #333; 
    padding:20px; 
    background:#eee; 
} 

@media screen and (max-width: 1260px) { 
    #wrapper { 
     margin: 20px; 
    } 
} 

#content { 
    background:#ccc; 
}

來源

2015-04-26 13:31:46

您是否嘗試過的CSS margin性質的東西嗎？

body 
{ 
margin: 20px; 
}

來源

2015-04-26 13:32:29 Anakin

您應該創建兩個div周圍一切都在你的身體，這樣的：

<html> 
    <head> 
     [...] 
    </head> 
    <body> 
     <div id="global"> 
      <div id="global-inner"> 
       [Your original code ...] 
      </div> 
     </div> 
    </body> 
</html>

然後你只需要做一些CSS

#global { 
    border: 1px solid #CCCCCC; 
    margin: 40px auto; 
    width: 90%; 
} 

#global-inner { 
    margin: 7% 7%; 
}

見的jsfiddle：https://jsfiddle.net/9usf2hmh/

希望我幫你:)

來源

2015-04-26 13:33:55 Bobot

您應該做的只是在您的身體或主容器上使用padding。

請記住，在那個特定的頁面設計，填充是左/右和頂部，底部padding是頁腳元素的一部分，這就是他實現在底部元素top-border

Here a working example

來源

2015-04-26 13:37:00 Matho

在CSS中的邊框邊距？

回答

相關問題