1

所以..

我制作了 css 图像，使其覆盖我网站的完整背景，然后在 HTML 上添加了一张图片。图片在那里，但我看不到它，因为它被css背景覆盖。

CSS

{ 
margin: 0; 
padding: 0; 
}

html, body, #bg, #bg table, #bg td, #cont {
height:100%;
width:100%;
overflow:hidden;
}

#bg { 
position: relative; 
}

#bg div {
height:200%;
left:-50%;
position:absolute;
top:-50%;
width:200%;
}

#bg td {
text-align:center;
vertical-align:middle;
}

#bg img {
margin:0 auto;
min-height:50%;
min-width:50%;
}

#cont {
position:absolute;
top:0;left:0;
z-index:70;
overflow:auto;
}

.box { 
margin: 0 auto; 
width: 400px;
padding: 50px;
background: white; 
padding-bottom:100px;
font: 14px/2.8 Georgia, Serif;
}

HTML

<!DOCTYPE html>
<html>

<head>


<meta charset="utf-8">



<title>Full Page Background Image | CSS #1</title>



<div style="background: url (C:\Users\***\Desktop\site\picture.png; z-index:1">
<img src="C:\Users\*****\Desktop\site\picture.png" position:relative; left:-20px;/>
</div>

<style>

    img.bg {
        /* Set rules to fill background */
        min-height: 100%;
        min-width: 1024px;

        /* Set up proportionate scaling */
        width: 100%;
        height: auto;

        /* Set up positioning */
        position: fixed;
        top: 0;
        left: 0;
    }

    @media screen and (max-width: 1024px){
        img.bg {
            left: 50%;
            margin-left: -512px; }
    }

#page-wrap { position: relative; width: 400px; margin: 50px auto; padding:        20px;  background: white; -moz-box-shadow: 0 0 20px black; -webkit-box-shadow: 0 0 20px black; box-shadow: 0 0 20px black; }
    p { font: 15px/2 Georgia, Serif; margin: 0 0 30px 0; text-indent: 40px; }
</style>
</head>

<body>

<img src="images/bg.jpg" class="bg">

<div id="page-wrap">

text


</div>

</body>

</html>

任何建议...谢谢

4

3 回答 3

1 
<div style="background-image:url('image.jpg');"}
<img src="image2.jpg" position:relative; left:-20px;/>
</div>
于 2013-05-26T17:42:10.687 回答
1

在背景图像上将 z-index 更改为 0，在要显示的图像上更改为 99。这可以通过以下方式完成：

(background id) {
  z-index: 0  }
(image id) {
  z-index: 99  }

这应该使图像“高于”背景。
希望这可以帮助 ：）

于 2014-05-21T19:00:12.490 回答
1

将您希望显示的图像的位置更改为相对或绝对我不记得确切是什么，我现在将处理它..

于 2013-05-26T17:22:09.760 回答