如何擺脫節之間的空白CSS/HTML

Question

我是新來的網頁設計和遇到這個問題;我有兩個部分，每個部分都有其贏得的背景圖像。但是，第一個背景圖像不會在上一個背景圖像之後結束。相反，兩張圖片之間有空白，看起來很可怕。

這是的jsfiddle：http://jsfiddle.net/M26Ge/

CSS：

#slide-1 .bcg { 
    background-image:url('http://upload.wikimedia.org/wikipedia/commons/1/15/Hopwas_Woods_Sun.jpg'); 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    height: 800px; 
    width: 100%; 
} 
#slide-2 .bcg{ 
    background-image:url('http://i953.photobucket.com/albums/ae11/Kronstadt/Shabby-Princess-Kristie_SF_StripedP.jpg'); 
    background-position: center center; 
    background-repeat: repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    height: 100%; 
    width: 100%; 
} 

Answer 1

我不知道，但也許你在找CSS Reset？

只需在css代碼頂部寫* { margin: 0; padding: 0; }即可。否則，如果您對內聯元素有其他空白問題，則可以在受影響元素的容器上使用font-size: 0;修復它們。

Answer 2

添加到您的CSS：

*{ 
    padding: 0; 
    margin: 0; 
} 

此設置爲零的所有元素的margin和padding。

Answer 3

您可以也通過

1. 持有的部分中hx和p元素邊緣的邊界設定爲第一子格。 Borders

   section>div { border:1px solid transparent }

2. 或padding會做：

   section div { padding:1px; }

要明白是怎麼回事，你可以閱讀this article。