背景图像并不总是出现[关闭]
Posted
技术标签:
【中文标题】背景图像并不总是出现[关闭]【英文标题】:background-image not appearing always [closed] 【发布时间】:2022-01-24 00:44:21 【问题描述】:我正在尝试将背景图片放在标题中,但它没有出现
header
width: 100vw;
height: 100vh;
background-image: url("../img/header-bg.png");
background-position: bottom;
background-size: cover;
align-items: flex-end;
display: flex;
justify-content: center;
```
【问题讨论】:
您是否尝试将margin: 0;
放入正文选择器中?我认为这会有所帮助
【参考方案1】:
试着把这个 css 放进去
body
margin: 0;
这是正常的,这是因为默认情况下浏览器会在正文上放置一个边距...使用我在上面编写的 css 删除该默认边距
其他方式也在使用
position: absolute
或fixed
与
top:0;
和left:0;
body
margin: 0;
header
width: 100vw;
height: 100vh;
background-image: url("https://laaouatni.github.io/w11-clone/images/1dark.jpg");
background-position: center;
background-size: cover;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header></header>
</body>
</html>
【讨论】:
以上是关于背景图像并不总是出现[关闭]的主要内容,如果未能解决你的问题,请参考以下文章