1. 首頁
  2. 問答
  3. 簡單的CSS問題 - 上面

簡單的CSS問題 - 上面

2016-07-23 68 views
1

空格我正在這裏即將推出頁：http://desertcinema.com/jheck/簡單的CSS問題 - 上面

但是我碰到一些問題與問候我<div class="background-filter"></div>元素頂部的額外空間。

enter image description here

基本上我有這個CSS的這一部分：

.background-filter { 
    width:100%; 
    height:100%; 
    display:block; 
    position:fixed; 
    background: #000; 
    opacity: 0.5; 
    z-index:0; 
    margin: 0; 
     -webkit-background-size: cover; 
     -moz-background-size: cover; 
     -ms-background-size: cover; 
     -o-background-size: cover; 
      background-size: cover; 
}

我想知道究竟是爲什麼我在頂部有空間的原因。這個div必須掩蓋整個空間的東西，沒有空格。

任何想法是什麼導致這種情況，以及如何解決它？您可以使用CHROME INSPECT ELEMENT進行遊戲。

來源

2016-07-23 Mikk Poles

回答

2

只需將樣式top: 0;添加到.background-filter。

元素的位置不會默認爲0,0。它的位置是相對於包含元素默認設置的。

來源

2016-07-23 10:23:09 TTCC

+0

它工作。謝謝！ –

+0

雖然這可行，但元素位置不爲0,0的原因是因爲在div之前顯示了一個字符。 – AliIshaq

+0

是的，建議您刪除頁面頂部的「>」字符。 @MikkPoles – TTCC

1

你在標記中有一個額外的>字符。你的CSS文件在這裏：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" type="text/css" media="screen" /> 
> 
<link href='https://fonts.googleapis.com/css?family=Oswald:400,700,300|Roboto+Slab:400,300,700' rel='stylesheet' type='text/css'>

修復，擺脫空間。

來源

2016-07-23 10:27:18 AliIshaq

0 
body { 
    margin: 0; 
    padding: 0; 
}

我不確定，但它可能是身體邊距或填充？

來源

2016-07-23 10:34:32 alieni

相關問題

 相關問題