盒子模型
什么是盒子
margin : 外边框
border : 边框
padding : 内边框
html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<link rel="stylesheet" href="../盒子模型/style.css">
</head>
<body>
<div id="box">
<h2>用户登录</h2>
<form action="" method="post">
<div>
<span>用户名</span>
<input type="text" name="user" placeholder="用户名">
</div>
<div>
<span>密码</span>
<input type="password" name="pwd" placeholder="请输入密码">
</div>
</form>
</div>
</body>
</html>
css：
/*body总有一个默认的外边框margin ： 0，定义初始值 */
body h2{
margin: 0;
padding: 0;
}
#box{
width: 250px;
height: 65px;
border: 2px solid seagreen;
}
form{
background: burlywood;
}
h2{
font-size: 16px;
color: #ce3939;
}
div:nth-of-type(1) input{
border: 1px solid #000000;
}
div:nth-of-type(2) input{
border: 1px dashed #000000;
}