我是Web开发和设计的新手。如何使这些元素彼此之间出现?
的HTML
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8" />
<title>
Title
</title>
<link rel = "stylesheet" type = "text/css" href = "index.css" />
</head>
<body>
<div id = "Container">
<div id = "Declaration">
<h1>
Hi.
</h1>
<h2>
Bye.
</h2>
</div>
<br />
<div id = "Skills">
Some skills
</div>
</div>
</body>
</html>
的CSS
div#Container
{
position: relative;
}
div#Declaration
{
position: absolute;
left: 40%;
padding-top: 250px;
}
div#Skills
{
background-color: rgb(72, 141, 200);
}
h1
{
font-family: "Gotham Narrow";
font-weight: 500;
}
h2
{
font-family: "Gotham Narrow";
font-weight: 300;
}
h3
{
font-family: "Gotham Narrow";
font-weight: 100;
}
我正在尝试将技能容器置于声明以下。但是它出现在上方吗?怎么了
最佳答案
尝试以下代码,这是FIDDLE
div#Container {
position: relative;
}
div#Declaration {
//position: absolute;/***Removed**/
left: 40%;
padding-top: 250px;
}
div#Skills {
background-color: rgb(72, 141, 200);
}
h1 {
font-family:"Gotham Narrow";
font-weight: 500;
}
h2 {
font-family:"Gotham Narrow";
font-weight: 300;
}
h3 {
font-family:"Gotham Narrow";
font-weight: 100;
}