简单的CSS问题 - 上面

html
css

2016-07-23 70 views 1 likes

空格我正在这里即将推出页：http://desertcinema.com/jheck/简单的CSS问题 - 上面

但是我碰到一些问题与问候我<div class="background-filter"></div>元素顶部的额外空间。

基本上我有这个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

回答

只需将样式top: 0;添加到.background-filter。

元素的位置不会默认为0,0。它的位置是相对于包含元素默认设置的。

来源

2016-07-23 10:23:09 TTCC

它工作。谢谢！ –

虽然这可行，但元素位置不为0,0的原因是因为在div之前显示了一个字符。 – AliIshaq

是的，建议您删除页面顶部的“>”字符。 @MikkPoles – TTCC

你在标记中有一个额外的>字符。你的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

body { 
    margin: 0; 
    padding: 0; 
}

我不确定，但它可能是身体边距或填充？

来源

2016-07-23 10:34:32 alieni

简单的CSS问题 - 上面

回答

相关问题