first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/fontendsix/每日课程/2021-10-20/position.html
+++ b/历届学生/fontendsix/每日课程/2021-10-20/position.html
@@ -0,0 +1,78 @@
+<!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>定位</title>
+    <style>
+        body {
+            margin: 0;
+        }
+
+        .main {
+            margin-left: 30px;
+        }
+
+        .box {
+            width: 200px;
+            height: 200px;
+            float: left;
+        }
+
+        .box_1 {
+            background: red;
+            position: relative;
+            left: 30px;
+            top: 40px;
+        }
+
+        .box_2 {
+            background: green;
+            position: relative;
+            left: 10px;
+            top: 20px;
+        }
+
+        .box_2_1 {
+            width: 100px;
+            height: 100px;
+            background: palevioletred;
+            position: absolute;
+            left: 20px;
+            top: 20px;
+        }
+
+        .box_3 {
+            background: yellow;
+            position: fixed;
+            right: 0;
+            bottom: 0;
+        }
+
+        .box_4 {
+            background: blue;
+        }
+    </style>
+</head>
+
+<body>
+
+
+    <div class="main">
+
+        <div class="box_1 box"></div>
+
+        <div class="box_2 box">
+            <div class="box_2_1"></div>
+        </div>
+
+        <div class="box_3 box"></div>
+        <div class="box_4 box"></div>
+
+    </div>
+
+</body>
+
+</html>
--- a/历届学生/fontendsix/每日课程/2021-10-20/笔记.txt
+++ b/历届学生/fontendsix/每日课程/2021-10-20/笔记.txt
@@ -0,0 +1,45 @@
+ border-radius   设置圆角
+ zoom 实现对元素的缩放，一般用于字体font-size 小于12px的情况
+ border 粗细 线条类型  线条颜色  
+  border: 1px solid #eee;
+
+ background-attachment: fixed;  背景图的定位
+ background-repeat  设置背景图是否重复
+ background-position  设置背景图定位
+cursor 修改光标的样式
+background-image: linear-gradient(角度, 第一个颜色, 第二个颜色);
+
+ 定位 position ：
+
+ 通过：left  right  top  bottom
+
+
+   相对定位 relative ：
+
+     当元素被设置相对定位后，他原本的位置还在，但是他脱离了页面（文档流）
+
+     定位参考对象：
+       它的定位参考对象就是原本的位置
+
+
+   绝对定位 absolute ：
+
+     当元素被设置绝对定位后，他原本的位置不在，但是他脱离了页面（文档流）
+
+     定位参考对象：
+       父元素是否设置过定位
+
+       是：定位参考对象就是父元素的位置（当前位置）
+       否：定位参考对象就是浏览器边框
+
+   固定定位 fixed ：
+
+     当元素被设置固定定位后，他原本的位置不在，但是他脱离了页面（文档流）
+
+      定位参考对象：
+        定位参考对象就是浏览器边框
+
+    z-index    
+
+
+