@Money_Murch我目前正在使用Atom.io，但肯定会尝试使用Visual Studio。谢谢！
我是css的新手，需要帮助。我正在关注this教程。
我是本教程的一个非常基本的部分，但是当他使用top: 50%;时，我的元素不会向下移动。请帮忙！谢谢！
我怀疑它与身体没有正确的高度有关？因为我已经了解到，为了使用top，元素必须具有高度。我正在使用height: 100vh;，因为他做到了。但我以前从未使用相对长度。
* {
margin: 0;
box-sizing: border-box;
padding: 0;
}
body {
height 100vh;
display: flex;
background-color: mediumspringgreen;
transition: background 0.5s ease;
position: relative;
}
.field-name,
.field-email,
.field-password,
.field-finish {
position: absolute;
top: 50%;
}<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width-device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/master.css">
<title>Learning Form Animation</title>
</head>
<body>
<form>
<div class="field-name">
<i class="fas fa-user"></i>
<input type="text" placeholder="Username" required>
<i class="fas fa-arrow-down"></i>
</div>
<div class="field-email">
<i class="fas fa-envelope"></i>
<input type="email" placeholder="Email" required>
<i class="fas fa-arrow-down"></i>
</div>
<div class="field-password">
<i class="fas fa-key"></i>
<input type="password" placeholder="Password" required>
<i class="fas fa-arrow-down"></i>
</div>
<div class="field-finish">
<i class="fas fa-heart"></i>
<p>Thank you!</p>
<i class="fas fa-heart"></i>
</div>
</form>
</body>
<script src="assets/js/main.js"></script>
</html>你身高后就错过了冒号。试试下面的代码
body {
height: 100vh;
display: flex;
background-color: mediumspringgreen;
transition: background 0.5s ease;
position: relative;
}
您在高度属性中缺少冒号：height：100vh;
body {
height: 100vh;
display: flex;
background-color: mediumspringgreen;
transition: background 0.5s ease;
position: relative;
}
编辑：
我在编写代码时使用Visual Studio，无论是c＃，html，javascript等......它可能对你有用。下载地点在这里：https://visualstudio.microsoft.com/downloads/