html - 去除全屏img中的白色条纹

标签 html css

我目前正在尝试制作登录页面,但遇到了问题。 <img>周围有一些白色条纹,它looks like this .

我希望图片是全屏的,没有任何条纹等。

<!DOCTYPE HTML>
<head>
    <title>Szafranowka - Apartments & Restaurant </title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <link rel="stylesheet" href="style.css" type="text/css" />
</head>

<body>
    <div id="container">

        <div id="background">
            <img src="background.jpg" id="background"> </img>
        </div>

    </div>
</body>
</html>

这是 CSS:

#container
{
    width: 100%;
    height: 100%;
}

#background
{
    width: 100%;
    height: auto;
    opacity: 0.6;
    position: relative;
}

最佳答案

内边距会自动应用于主体。

只需将其添加到您的 CSS

body{
  padding:0;
  margin:0;
}

编辑:在评论中跟进的解决方案

您需要删除 <img>标记并更改 css 中的背景 div

#background
{
    width: 100%;
    height: auto;
    background: url("background.jpg");
    background-size: cover;
    opacity: 0.6;
    position: relative;
}

关于html - 去除全屏img中的白色条纹,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48175250/

相关文章:

php - 简化代码

css - React js 语义菜单项位于中心

html - 在 html/css 导航栏中对齐输入/按钮

jquery - 如何在 html 中使用 fly on checkbox 添加多个东西?

php - 如何创建一个函数来获取变量、检索变量并在预览页面上访问它们

javascript - 未捕获的 ReferenceError : function is not defined at HTMLInputElement. onclick

javascript - 在 Javascript 中取消重定向?

css - 多个#ids,每个都有很多相同的代码,但略有不同——写这个的有效方法?

javascript - 当我希望它在下面滚动时,表格会在固定的 div 上滚动

javascript - 用css display table-column显示柱状数据