html - 在 css 中声明的图像未显示

标签 html css

我想要一个图像来填充浏览器,这些是 html 边代码

<!DOCTYPE html>
<html>
<head>
    <title>Testing</title>
    <link rel="stylesheet" type="text/css" href="css/styles.css">
</head>
<body>

</body>
</html>

因为我想让图像在屏幕上完全占据,所以我在 css 中声明了它,但遗憾的是图像没有出现在屏幕上

body{
    background-image:url('../img/bgmapsimage.png');
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
}

是的,图片名称正确,位置也正确。这是我引用的链接 link

最佳答案

查看此链接:https://css-tricks.com/perfect-full-page-background-image/

body{ 
    background: url(images/bg.jpg) no-repeat center center fixed; 
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
    background-size: cover;
}

无论屏幕尺寸如何,您也可以使用 vh 获得全高图像。

关于html - 在 css 中声明的图像未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40318402/

相关文章:

javascript - 使用带有按钮的JS函数来显示变量

html - 自动幻灯片

html - 固定定位破坏 z-index

javascript - 如何使链接适合其内部的组件?

jquery - 为菜单 2 级添加事件,hiliting 2 级菜单 jquery

javascript - 禁用网页上的滚动并仅允许在页面部分上滚动

javascript - Bootstrap Modal + Carousel Gallery 不显示图像

html - 如何更改 Safari Web Apps 的 iOS 状态栏的背景颜色?

javascript - Jquery 选择带斜杠的属性

css - 移动版本上不同顺序的 Bootstrap