无法在CSS中设置背景图片
我尝试使用以下代码通过 CSS 设置页面的背景图像,但没有图像显示。图像将平铺在页面上,大小仅为 10x10px。尽管如此,它仍然没有出现。请你告诉我我做错了什么吗?
<body>
<div id="background"></div>
</body>
#background {
background-image: url("img/background.png");
}
I am trying to set my background image of the page via CSS using the following code, but no image shows up. The image will be tiled on the page and is only 10x10px big. Nonetheless, it still doesn't show up. Please can you tell me what I am doing wrong?
<body>
<div id="background"></div>
</body>
#background {
background-image: url("img/background.png");
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(8)
图像位于
linkToCssFolder/img/background.png
中吗? 图像路径是相对于您的 CSS 文件的。另外,您的
#background
div 中是否有内容?如果没有,它可能会有默认的0px
高度,并且不显示任何背景。Is the image in
linkToCssFolder/img/background.png
? The image path is relative to your CSS file.Also, does your
#background
div have content in it? If not, it will probably have the default0px
height, and not show any background.您还需要给出元素尺寸...
背景图像不会使它们的容器拉伸以适应。
You need to give the element dimensions too...
Background images do not make their container stretch to fit.
这是所有CSS关键字的列表
刚刚在http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_background_multiple 就可以了。
我假设您的图像位置不正确,或者背景属性是否被样式或其他 CSS 规则覆盖。
Here is a list of all CSS keywords
Just tried this at http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_background_multiple and it works.
I assume your image is not at right location or if the background property is being over written by style or another css rule.
css 和 html 等简单的东西经常被忘记,即使是专业人士也会因为缺乏适当的注意力和疲劳而忘记。如果你知道它就休息一会儿。
如果您迷失在网页设计之树中,这里有一些提示。
such a no brainer thingy of css and html often forgotten even professional due lack of proper focus and just being tired.If you knew it just rest for a while.
here are some tips if you lost in the tree of web design.
首先检查你的CSS和图像位置
1)两者都在同一个文件夹中,然后简单地尝试“background-image: url("background.jpg")”。
2)如果该文件夹中有 img 文件夹和图像,请尝试“background-image: url("img/background.jpg"); "
3)如果你有 img 文件夹并且如果你有 CSS 文件夹,那么你必须后退一步,然后转到图像文件夹并选择图像,它看起来像这样“background-image: url("../img/background.jpg" ); " 其中 '..' 代表后退一步
Firstly check your CSS and image location
1) Both in same folder then try " background-image: url("background.jpg") " simply.
2) If you have img folder and image inside this folder then try " background-image: url("img/background.jpg"); "
3)If you have img folder and If you have CSS folder then you have to go one step back then goes to image folder and choose image it seem like this " background-image: url("../img/background.jpg"); " where '..'represent one step back
在 css 中添加
height
元素add
height
element in css另一个错误来源可能来自图像扩展名,例如:
background-image: url("img/background.png")
Another source of error may come from image extension name, for instance in :
background-image: url("img/background.png")
嘿,
要获取图像,您必须想象自己位于终端(或 cmd 提示符)中,并按照获取图像的方式进行编写。
假设您的 css 文件是 /css/,而您的图像位于 /img/background.png。
要获取图像,您必须编写以下代码
background-image: url("../img/background.png");
这是因为在终端/cmd 提示符下要从您的.css 文件,您将首先键入 cd ..,然后键入 cd img,然后键入 background.png。希望对您有帮助!
干杯!
Hy,
to get your image you must imagine that you are in a terminal(or cmd prompt) and write as youuld do to get to the image.
So let us say that your css file is /css/ and you image is in /img/background.png.
To get to the image you must write this code
background-image: url("../img/background.png");
This is because in terminal/cmd prompt to get to the image from your .css file you would first type cd .., then cd img, then background.png. Hope it will help you!
Cheers!