多个图像对齐问题在CSS [英] Multiple images align issue in css
问题描述
我是css和html的新手。我做了一个应用程序，页面在html和css。这些是我的网页的图片：
I am new to css and html. I made an application, and the pages in html and css. These are the images of my pages:
第二个是主页，即用户页
and the second one is home page, that is user page
这是我的.css文件代码片段：
This is my .css file code snippet:
body{
background-color:#D8D8D8;
background-image:url("../images/spring.png"), url("../images/security.png");
background-size:200px 100px, 200px 100px;
background-repeat:no-repeat, no-repeat;
background-position:top right, bottom right;
margin-right:200px;
margin-left:15px;
}
问题：在两个页面中不对齐，并且我需要第二个图像在页面的底部，就像在页面的最顶部的第一个图像。任何身体可以指导我如何做到。我很抱歉的语言，因为它是可怕的。谢谢。
Problem: As you can see the images are not align same in the two pages, and I need the second image to be at the bottom of the page like the first one which is at top most of the page. Can any body guide me how to do it. I am sorry for the language as it is terrible. Thank you.
推荐答案
我不知道它是如何工作的（两个背景图像在同一对象），但你可以使用代码：
I dont know how it works for you (two background image at same object), but you can use this code:
<html>
<head>
<style>
img.first_image { position: absolute; top: 0px; }
img.second_image { position: absolute; bottom: 0px; }
body
{ background-color:#D8D8D8;
background-size:200px 100px, 200px 100px;
background-repeat:no-repeat, no-repeat;
background-position:top right, bottom right;
margin-right:200px;
margin-left:15px;
height:100%;
}
</style>
</head>
<body>
<img src="../images/spring.png" class="first_image" />
<div>
<!-- every things you need -->
</div>
<img src="../images/security.png" class="second_image" />
<body>
</html>
这篇关于多个图像对齐问题在CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
