保持页脚的中心图像

时间:2017-06-08 20:23:53

标签: html css css-position

我一直在尝试将图像置于中心(能够做到这一点),同时仍然有一个会粘在页面底部的页脚。

我似乎无法弄清楚如何将页脚放在底部,因为我正在定位图像。

这就是我所拥有的:

body {
    margin:0;
    padding:0;
    text-align:center;
    background-color:black;
    color: #463D38;
}

#Content {
    clear:both; 
    width:500px;
    margin:0px auto;
    text-align:center;
    padding:15px;
    height:240px; 
    position:absolute;
    top: 50%;
    left: 50%;
}

#inner {
    position: relative;
    top: -50%;
    left: -50%;
}

#text-center{
    text-align:center;
    font-family:Tahoma, Geneva, sans-serif
}

.footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: #efefef;
  text-align: center;
}

以下是该页面的HTML代码:

<head>
<title>Title</title>
</head>

<body>
<div id="Content">
<div id="inner">
<img src="logo332.png" width="500" height="163">
</div>

<div class="footer">test</div>
</body>
</html>

关于我如何让这两个人互相配合的任何指示或建议?

非常感谢。

1 个答案:

答案 0 :(得分:0)

如果要粘贴页脚,则需要将其定位:固定;