// HTML >>> 第一种样式
<!DOCTYPE html>
<html>
<head><link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body style="padding:5px;"><form role="form"><div class="form-group"><label for="Email1">邮箱地址</label><input type="email" class="form-control" id="Email1" placeholder="Enter email"><!-- 添加 form-control 类用于将表单设置为 100% 宽度, 并添加样式上的美化 --></div><div class="form-group"><label for="Password1">密码</label><input type="password" class="form-control" id="Password1" placeholder="Password"></div><div class="form-group"><label for="exampleInputFile">文件上传 </label><input type="file" id="exampleInputFile"><p class="help-block"> ...... </p></div><div class="checkbox"><label><input type="checkbox">请勾选</label></div><button type="submit" class="btn btn-default">提交</button>
</form></body>
</html>
参考 《CSS高效开发实战》 P160
