如何使元素超越其他元素

时间:2019-03-15 10:33:25

标签: html css

这是我的代码。我希望将<div id="home">显示在<div id="navigate"下方。实现此目标的最佳方法是什么?

#home {
    background-color: black;
    color: grey;
    text-align: center;
    font-size: 20px;
}

#navigate {
    margin-top: 20px;
    border-style: solid;
    border-width: 3px;
    border-radius: 15px;
    border-color: grey;
    z-index: 0;
}
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="style-sheet/index.css"></link>
		<script src="scr/index.js"></script>
	</head>
	<body>
		<div>
			<div id="navigate">
				<div id="home">Home</div>
			</div>
			<div id="page">
				
			</div>
		</div>
	</body>
</html>

1 个答案:

答案 0 :(得分:0)

您到底想在这里实现什么? 您是否需要导航div下面的主文本? 您只需将其更改为此:

<div>
    <div id="navigate">
    </div>
    <div id="page"> 
        <div id="home">Home</div>           
    </div>
</div>

这会将主页放置在页面内部,您没有在#page中放入任何CSS,因此我想多数民众赞成在导航栏下面的所有元素。