多个图像对齐问题在css

我是新来的CSS和HTML。我做了一个应用程序，并在HTML和CSS的页面。这是我的网页的图片：多个图像对齐问题在css

home page

这是我的.css文件的代码片段：

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; 
    }

问题：正如你所看到的，两页中的图像不对齐，我需要第二个图像位于页面的底部，就像第一个图像位于页面的最顶部。任何人都可以指导我如何去做。我很抱歉这门语言太糟糕了。谢谢。

来源

2012-02-28 AbdulAziz

我不知道它是如何工作的，你（在同一对象两个背景图像），但你可以使用此代码：

<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>

来源

2012-02-28 16:22:26 samra

将height:100%添加到body和html。

来源

2012-02-28 15:20:45 bookcasey

请你能引导我米矿石。我的意思是你可以更精确的如何添加到HTML？我在正文中添加了，但在html中添加的位置？谢谢 – AbdulAziz 2012-02-29 09:25:58

'html {height：100％; }' – bookcasey 2012-02-29 15:39:06

尝试像

body,html {height: 100%; width: 100%;} 

#image-id {position: absolute; bottom: 0; right: 0;}

来源

2012-02-28 15:22:13

都设置图片位置予以确定。然后第一个右上角，第二个右下角。然后，即使页面内容变得更长且可滚动，您仍然可以在任何时候处于希望的位置。

来源

2012-02-28 15:26:45

你是这个意思吗？ '背景 - 位置：固定，固定;' – AbdulAziz 2012-02-29 09:21:27

这似乎是身体不是页面的整个高度尝试

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; 
    height:100%; 
}

这也许是有点过分，但...这可能是值得将其设置为height:95%;如果它会导致滚动条出现

来源

2012-02-28 15:29:38 imma

多个图像对齐问题在css

回答

相关问题