Html 标题及；页脚标志_Html_Header_Footer

Html 标题及；页脚标志

html

Html 标题及；页脚标志,html,header,footer,Html,Header,Footer,如何移动我的页脚徽标，如页眉徽标？我想这样创作 ------------------------- | __________ | |______| HeadLogo |____ | | |_________ | | | | | | | | | ______________ | |---| FootLogo

如何移动我的页脚徽标，如页眉徽标？我想这样创作

-------------------------
|       __________      |
|______| HeadLogo |____ |
|      |_________ |     |
|                       |
|                       |
|                       |
|    ______________     |
|---|   FootLogo   |----|
|    ---------------    |
|_______________________|

预览我的网页

我的html

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css.css" />
</head>
<body>

<div class="all">
<div class="middle">


</div>
<div class="top">
<img src="images/head.png" class="top-img"></img>

</div>

<div class="bottom">
<img src="images/foot.png"></img>
</div>

</div>

</body>
</html>

谢谢：D

您将

div.bottom

的

overflow

样式设置为hidden，这意味着它将隐藏其中任何溢出的内容

因此，“footlogo”位于

div

内，如果您尝试将其位置更改为

主体

和

底部

元素之间，它将从视图中隐藏

PS：我注释掉了

溢出

样式，您可以取消注释它并查看它的行为

将css作为

Position:relative

粘贴到页脚徽标上，并根据使用的上、下、左、右进行调整

css

根据这本书，一切看起来都很好。试着添加图片，看看它看起来如何。谢谢你修改我的预览。对不起，我的意思是在身体和底部之间有脚印，但谢谢你的帮助。哦，我不知道是溢出造成了麻烦，非常感谢，很抱歉我不能给你名声，但谢谢你，我从你那里得到了新的知识

Position:relative

.bottom {
background-color:#d7cc75;
width:100%;
height:7%;
position:relative;
bottom:0px;
text-align:center;
overflow:hidden;
z-index:1;
}