我是网络开发和设计的新手。如何让这些元素一个接一个地出现?
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;
}
关于html - 如何垂直排列元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25339713/