first commit

This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions

View File

@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body {
margin: 0;
padding: 0;
height: 3000px;
}
.box {
float: left;
width: 200px;
height: 200px;
}
.box_1 {
background: red;
position: relative;
left: 85px;
top: 54px;
}
.box_2 {
background: yellow;
}
.box_3 {
background: green;
}
.box_3_1 {
width: 100px;
height: 100px;
background: black;
position: absolute;
}
.box_4 {
background: blue;
position: fixed;
right: 0;
bottom: 0;
}
</style>
</head>
<body>
<div class="box box_1"></div>
<div class="box box_2"></div>
<div class="box box_3">
<div class="box_3_1"></div>
</div>
<div class="box box_4"></div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
定位:
把元素按照你的想法放在网页的如何一个位置!!!
相对定位 relative
当元素被设置相对定位后元素飘到3维空间里面了
他原本的位置还在,没有被删除
他的定位参考对象就是原本位置的左上角
绝对定位 absolute
当元素被设置绝对定位后元素飘到3维空间里面了
他原本的位置不在,被删除
他的定位参考对象:
父元素
父元素如果有定位,那么参考父元素的位置来
父元素如果没有定位,那么参考浏览器来
使用场景:
子元素绝对定位的时候,一般都在最近父元素上开启 相对定位
固定定位 fixed
当元素被设置绝对定位后元素飘到3维空间里面了
他原本的位置不在,被删除
他的定位参考对象是屏幕