1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 7 <style> 8 /*body总有一个默认的外边距margin=0,常规操作*/ 9 /*h1,ul,li,a,body{*/ 10 /* margin:0;*/ 11 /* padding:0;*/ 12 /* text-decoration: none;*/ 13 /*}*/ 14 #box{ 15 width: 300px; 16 border:1px solid red; 17 } 18 h2{ 19 font-size: 16px; 20 background-color: aquamarine; 21 line-height: 40px; 22 color: white; 23 } 24 form{ 25 background: aquamarine; 26 } 27 div:nth-of-type(1) input{ 28 border: 3px solid black; 29 } 30 div:nth-of-type(2) input{ 31 border: 3px dashed red;/*dashed red 红色虚线*/ 32 } 33 div:nth-of-type(3) input{ 34 border: 3px dashed greenyellow; 35 } 36 37 </style> 38 39 </head> 40 <body> 41 <div id="box"> 42 <h2>会员登录</h2> 43 <form action="#" method="get"> 44 <div> 45 <span>用户名</span> 46 <input type="text"> 47 </div> 48 <div> 49 <span>密码</span> 50 <input type="password"> 51 </div> 52 <div> 53 <span>邮箱</span> 54 <input type="email"> 55 </div> 56 </form> 57 58 </div> 59 </body> 60 </html>