步骤
1.导入静态资源
2.页面实现
代码
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="../static/css/bootstrap.min.css">
<script src="../static/js/bootstrap.min.js"></script>
<title>Hello, world!</title>
</head>
<body>
<div style="border: solid 3px darkgrey;width: 500px;height: 400px;position: relative;top: 133px" class="mx-auto">
<form class="mx-auto" style="width: 800px;position: relative;left: 120px;top: 41px">
<div class="form-group">
<label for="email">email address</label>
<input type="email" class="form-control col-4 " id="email" aria-describedby="emailHelp">
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else</small>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control col-4" id="password">
</div>
<div class="form-group form-check">
<input type="checkbox" class="form-check-input" id="check">
<label class="form-check-label" for="check">Check me out</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</body>
</html>
结果
image.png
