使图像在文本后面，并保持它在中心使用CSS [英] Make the image go behind the text and keep it in center using css
问题描述
我创建一个网页，其中我有一个图像，我想放在中心，然后在该图像的顶部，我想有输入框和标签和提交按钮。
I am creating a webpage, where i have an image, that i want to place in the center and then on the top of that image i want to have input boxes and labels and submit button.
我试图使用css
img.center
{
z-index:-1;
}
但这不起作用。当我将代码更改为
but this does not works. and when i change the code to
img.center
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
如果使图像落后， c> left：0px 和 top：0px ...它把图片放在loaction 0,0 ..在中心。
if make the image go behind, but then as i used left:0px and top:0px ... it puts the image at loaction 0,0 .. but i want the image to stay in the center.
以保持图像在中心，我有< div align =center> 标签。
to keep the image in the center i have <div align="center"> tag.
仍然存在，我可以保持图像在中心，并使它落后吗？
is there anyway, i can keep the image in the center and make it go behind too???
我的.html页面看起来像这样:(我试图有一个背景图片为我的div标签，但没有图像显示在那里）
My .html page looks like this:(i did tried to have a background image for my div tag, but no image is appearing over there)
<html>
<head>
<title>Question of the Week</title>
<style type="text/css">
body
{
background-image:url('images/background.jpg');
background-repeat:repeat-x;
}
.container
{
background-image:url('images/center.jpg');
background-repeat:no-repeat;
}
td.cntr {padding-top:50px;}
</style>
</head>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><div align="left"><img src="images/logo.jpg"></div></td>
<td></td>
<td><div align="right"><img src="images/right_logo.jpg"></div></td></tr>
</table>
</tr>
<tr>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="cntr">
<div id="container">
<input name="box" type="textbox" />
<input name="box" type="textbox" />
<input name="submit" type="submit" />
</div>
</td>
</tr>
</table>
</tr>
</table>
</body>
</html>
推荐答案
网站/容器，并放上你想要的任何东西。所以说你有：
Well, put your image in the back ground of your website/container and put whatever you want on top of that. so say you have:
<div id="container">
<input name="box" type="textbox" />
<input name="box" type="textbox" />
<input name="submit" type="submit" />
</div>
这是在您的代码中，您的CSS将如下所示：
This is be in your code and you CSS would look like:
#container {
background-image:url(yourimage.jpg);
background-position:center;
width:700px;
height:400px;
}
对于这个工作，你必须指定高度和宽度到某些值（即没有％）如果你需要它，我可以更具体地帮助你，但我需要更多的信息。
For this to work tho, you must have height and width specified to certain values (i.e. no %'s) I could help you more specifically if you needed it, but I'd need more info.
这篇关于使图像在文本后面，并保持它在中心使用CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
