演示代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="reset.css"/>
<style type="text/css">
.box{width: 302px;height: 302px;border: 1px solid #000000;margin: 50px auto;}
.pst1,.pst2,.pst3{width: 100px;height: 100px;}
.pst1{background-color: #ff0000;}
.pst2{background-color: #00ff00;}
.pst3{background-color: #0000ff;}
</style>
</head>
<body>
<!--
定位：规定元素的位置。用于没有规律元素的布局。
定位三种类型：相对定位、绝对定位、固定定位
定位使用方法：
1，规定哪一种定位方法
2，指定在方向上的偏移量（top、bottom、left、right）
3，注意，top和bottom同时设置只有一个方向生效，left和right也一样
-->
<div class="box">
<!-- div.pst$*3 -->
<div class="pst1"></div>
<div class="pst2"></div>
<div class="pst3"></div>
</div>
</body>
</html>
