CSS中的定位，用position语法方法，定位又分为绝对定位、相对定位和固定定位。
position语法为CSS2版本，无继承性，默认值为：static。
position语法
语法：position：static | relative | absolute | fixed
代码案列
position：static；
取值说明
static：默认无定位。无特殊定位，对象遵循正常文档流。top，right，bottom，left等属性不会被应用。
relative：相对于自身坐标定位。对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。
absolute：相对于上级元素坐标定位。对象脱离正常文档流，使用top，right，bottom，left等属性进行绝对定位。而其层叠通过z-index属性定义。
fixed：固定坐标到页面。对象脱离正常文档流，使用top，right，bottom，left等属性以窗口为参考点进行定位，当出现滚动条时，对象不会随着滚动。IE6及以下不支持此参数值
兼容性
除IE6及更早浏览器不支持position属性的fixed参数值，其他都兼容。
实战案列
效果演示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>position</title>
<style>
#position {
position: absolute;
top: 20px;
left: 20px;
width: 150px;
height: 40px;
padding: 0 10px;
background: #eee;
}
</style>
</head>
<body>
<div id="position">相对于页面的绝对定位方法</div>
</body>
</html>相关专题
css
2021-09-24 78css是前端开发中的样式语言,学好CSS可以帮助开发出漂亮的模板,css专题为您整理本站所有css相关信息,包含css模板下载,css使用教程分享和css示例代码....
- css3海浪波浪动态效果代码 [2021-10-25]
- css样式内加载其他CSS文件方法 [2021-09-27]
- HTML5+CSS3前端开发基础入门视频教程 [2021-09-16]
- HTML+CSS物业后台管理系统模板 [2021-08-15]
- HTML5/CSS3响应式Synthetica团队介绍模板 [2021-04-06]
