CSS定位可以通过position属性来实现，它有四个值：static、relative、absolute和fixed。
static：默认值，没有定位。relative：相对于元素在文档流中的原始位置进行定位。absolute：相对于最近的非static定位的父元素进行定位。fixed：相对于浏览器窗口进行定位。
实例代码：
<!DOCTYPE html>
<html>
<head>
<style>
.static {
position: static; /* 默认位置 */
left: 50px; /* 不会有效果 */
top: 50px; /* 不会有效果 */
}
.relative {
position: relative; /* 相对于元素的原始位置 */
left: 50px; /* 向右移动50像素 */
top: 50px; /* 向下移动50像素 */
}
.absolute {
position: absolute; /* 相对于最近的非static定位的父元素 */
left: 50px; /* 向右移动50像素 */
top: 50px; /* 向下移动50像素 */
}
.fixed {
position: fixed; /* 相对于浏览器窗口 */
right: 50px; /* 向右移动50像素 */
bottom: 50px; /* 向上移动50像素 */
}
.parent {
position: relative; /* 设置为relative，使得内部的absolute元素相对于它进行定位 */
width: 200px;
height: 200px;
background-color: lightblue;
}
</style>
</head>
<body>
<div class="static">Static Element</div>
<div class="relative">Relative Element</div>
<div class="parent">
<div class="absolute">Absolute Element</div>
</div>
<div class="fixed">Fixed Element</div>
</body>
</html>在这个例子中，.static类没有定位，.relative类相对于其在文档流中的原始位置移动，.absolute类相对于最近的.parent父元素定位，而.fixed类总是相对于浏览器窗口定位。