HTML/CSS 背景图像仅显示所用图像的一部分

发布于 2024-12-03 06:11:49 字数 371 浏览 0 评论 0原文

正如标题所说, 我目前正在建立一个网站,我对此很陌生,并且正在努力快速学习。然而,这个问题非常令人沮丧,因为我访问的网站没有帮助。

所以目前我有一个分辨率足够高的图像,它应该很容易填满屏幕。然而,当我加载 HTML 时,图像会在右上角放大,这是唯一可见的部分。我尝试过使用“高度”和“宽度”命令。我也尝试过没有它们。我尝试使用

。然而这个问题仍然存在。

另一点是,当我使用

时,整个屏幕并未被填充,它在我认为是
的周围仍然有一个白色边框。

As the title states,
I am currently building a website, I am new to this and am trying to learn quickly. However this problem is quite frustrating as websites I have gone to do not help.

So at the moment I have an image that is of a high enough resolution that it should fill the screen easily. However when I load the HTML the image is zoomed in on the top right corner which is the only part visible. I have tried using "height" and "width" commands. I have also tried without them. I have attempted to use a <div> and <body>. However this problem still persists.

Another point is that when I use a <div> the whole screen is not filled, it still has a white border around what I believe is the <div>.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

甜心 2024-12-10 06:11:49

如果您需要支持较旧的浏览器,这并不只是添加一两个属性那么简单。

阅读此内容: http://css-tricks.com/3458-perfect -整页背景图像/

另一点是,当我使用

时,整个屏幕不是
填充后,它仍然有一个白色边框,我认为是

.

您需要此 CSS 来删除 body 上的默认 margin

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

If you need to support older browsers, it's not as simple as just adding one or two properties.

Read this: http://css-tricks.com/3458-perfect-full-page-background-image/

Another point is that when I use a <div> the whole screen is not
filled, it still has a white border around what I believe is the
<div>.

You need this CSS to remove the default margin on body:

html, body {
    margin: 0;
    padding: 0;
}
何时共饮酒 2024-12-10 06:11:49

好的,我建议您不要以 px 为单位而是以 % 为单位设置宽度和高度,然后尝试使用 CSS 设置图像

阅读此链接,它将更有用
http://css-tricks.com/3458-perfect-full-页面背景图像/

OK, I would suggest you to make the width and height not in px but in % and secondly try setting the image using CSS

Read this Link, it will be more useful
http://css-tricks.com/3458-perfect-full-page-background-image/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文