1、css样式之边框：border
实心的边框：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
</head>
<body>
<div style="border:1px solid blue;height:200px"></div>
</body>
</html>
虚心的边框：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
</head>
<body>
<div style="border:1px dotted blue;height:200px"></div>
</body>
</html>
2、css样式之内外边距
外边距：margin
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
</head>
<body>
<div style="height:200px;border:1px solid red;">
<div style="height:30px;background-color:#999;margin-top:10px;margin-left:1250px;margin-right:10px;">
guojianglin
</div>
</div>
</body>
</html>
内边距：padding
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
</head>
<body>
<div style="height:200px;border:1px solid red;">
<div style="height:30px;background-color:#999;padding-top:50px;">
guojianglin
</div>
</div>
</body>
</html>