background-image:url无法正常工作

时间:2015-04-29 05:51:33

标签: javascript jquery html

我遇到的问题是,当我使用javascript将html文件放入另一个html文件时,背景图像变为不可见。但是当我用背景图像打开文件时,图像可见。

为了使其易于理解,我想在 first.html 中使用javascript包含 second.html (带有背景图片),而不会让图片不可见。

First.html(主要)

<html>
    <head>
        <script> 
            $(function(){
                $("#second").load("second.html");
            });
        </script> 
    </head>
    <body>
        <div id="second"></div>
    </body>
</html>

Second.html(带图片)

<body style="background-image: url('img/dashboard-layout.png'); background-repeat: no-repeat; background-color: #303032;">
    <!--Code goes here-->
</body>

1 个答案:

答案 0 :(得分:0)

这是我的工作范例 first.html

<html>
  <head>
    <script> 
       $(function(){
            $("#second").load("second.html");
        });
    </script> 
   </head>
   <body>
      <div id="second" style="height:100px;width:100%;"></div>
   </body>

second.html

<div style="height:100px;width:100%;background-image: url('http://blogs.atlassian.com/wp-content/uploads/01-new-icons.png'); background-color: #303032;">

请注意,div的默认高度为= 0px,您需要设置div的高度才能实现此目的。