Question

我一直很耐心，这是......

aside{
        width: 300px;
        margin: 0 10px 10px 0;
        padding: 5px;
        background-image:url ("images/simple_dashed_@2X.png");
        position:relative;
        float: right;
        height: 800px;
        border: solid #002222; 
        color: #bab1b1;
        text-align:center;
    }

images文件夹与.html文件位于同一文件夹中。我也试过（“... / images/simple_dashed_@2X.png”）我还检查并重新检查了图片的名称，它是正确的大小写等等。它什么都没有显示出来。

Answer 1

从你对这个问题的整体混乱程度来看，你没有正确使用Chrome开发者工具。

你可以使用Inspector来确定图像是否没有加载，只是屏幕外等等。

请观看此视频，其中JavaScript的蝙蝠侠，Paul Irish，解释： http://www.youtube.com/watch?v=O3W1yuq-ZlE

我保证您在观看此视频约20分钟后可以自行解决问题。

Answer 2

图像引用与 CSS 文件相关，而不是 HTML 文档。您能否按比例调整图像路径？

所以，如果您的文件布局如下：

/
 page.html
 /assets
  /CSS
    styles.css
 /images
    simple_dashed_@2X.png

你的风格应该是：

 background-image:url ("../../images/simple_dashed_@2X.png");

Answer 3

替换

background-image:url ("images/simple_dashed_@2X.png");

与

background-image:url("images/simple_dashed_@2X.png");

在网址之后离开空间，它应该再次运行。

Js小提琴 - ＆gt; http://jsfiddle.net/niteshp27/XMUmq/

css背景图像将无法正常工作

3 个答案: