在复习的过程中总结了一些知识点,在以后会陆续分享给大家,有不对的地方也请大家指正!!!
CSS定位分类及用法
1.默认定位
position:static
在不写的情况下默认为默认定位
2.绝对定位
position:absoluted
相对于最近的父元素定位,定位后空间释放
3.相对定位
position:relative
相对于自己定位,定位后空间不释放
4.固定定位
position:fixed
相对于浏览器定位,定位后空间释放
5.吸顶定位
position:sticky
空间释放
以下附上吸顶定位代码测试:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0px;
padding: 0px;
}
body {
height: 2000px;
background: #63a35c;
}
#div1{
position: sticky;
left: 100px;
top: 0px;
background: red;
width: 200px;
}
</style>
</head>
<body>
adqwdqdqdq
<div id="div1">
dgasgasfas
</div>
</body>
</html>
欢迎大家提出各种意见,定位是我们在css学习中很重要的一部分知识,在项目中会经常用到,在找工作面试时也是考官经常问的问题,希望本文对大家的学习有所帮助!!!