From a88784e0dede2b718934083fcbf7cb67b6814ebd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=86=E6=BB=A2=E9=92=B0?=
<14091774+well-yes@user.noreply.gitee.com>
Date: Sun, 27 Oct 2024 18:08:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=B0=E6=97=B6=E9=97=B4=E4=BA=A4=E4=BD=9C?=
=?UTF-8?q?=E4=B8=9A=E4=BA=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../20241021-\345\256\232\344\275\215.md" | 181 ++++++++++
...3-\351\200\211\346\213\251\345\231\250.md" | 124 +++++++
.../20241024-\345\212\250\347\224\273.md" | 323 ++++++++++++++++++
3 files changed, 628 insertions(+)
create mode 100644 "\351\231\206\346\273\242\351\222\260/20241021-\345\256\232\344\275\215.md"
create mode 100644 "\351\231\206\346\273\242\351\222\260/20241023-\351\200\211\346\213\251\345\231\250.md"
create mode 100644 "\351\231\206\346\273\242\351\222\260/20241024-\345\212\250\347\224\273.md"
diff --git "a/\351\231\206\346\273\242\351\222\260/20241021-\345\256\232\344\275\215.md" "b/\351\231\206\346\273\242\351\222\260/20241021-\345\256\232\344\275\215.md"
new file mode 100644
index 0000000..052c6e1
--- /dev/null
+++ "b/\351\231\206\346\273\242\351\222\260/20241021-\345\256\232\344\275\215.md"
@@ -0,0 +1,181 @@
+## CSS3 定位属性
+1. position 属性
+ - position 属性定义了一个元素在页面上的定位方式。它可以取以下几个值：
+
+ - static：默认值，元素按照正常的文档流进行布局。
+ - relative：元素进行定位，但它的位置是相对于其正常位置。
+ - absolute：元素进行定位，它的位置是相对于最近的已定位（非 static）祖先元素。如果不存在这样的祖先元素，则相对于初始包含块（通常是文档 body）。
+ - fixed：元素进行定位，它的位置相对于浏览器窗口固定不动。
+ - sticky：元素根据正常文档流进行布局，但当页面滚动到某个位置时，元素会固定在某个位置。
+2. top, right, bottom, left 属性
+这些属性用于指定元素相对于其定位上下文的最终位置。它们的值可以是：
+ - 长度值（如 px, em, rem, % 等）
+ - 关键字（如 auto, inherit）
+3. z-index 属性
+ - z-index 属性定义了元素的堆叠顺序。当元素重叠时，z-index 值越高的元素会覆盖值较低的元素。它可以取整数值，正数、负数或零。
+
+## 作业效果图
+
+## 主要代码
+```html
+
+
+
+
+
+ Document
+
+
+
+
+
+
+```
+
+## 作业效果图
+
+## 主要代码
+```html
+
+
+
+
+
+ Document
+
+
+
+
+ 1111111111
+
+
+
+
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+ 22222222222222222222222222222222222222222222222222222
+
+
+
+```
+
+## 作业效果图
+
+## 主要代码
+```html
+
+
+
+
+
+ Document
+
+
+
+
+
+
+```
\ No newline at end of file
diff --git "a/\351\231\206\346\273\242\351\222\260/20241023-\351\200\211\346\213\251\345\231\250.md" "b/\351\231\206\346\273\242\351\222\260/20241023-\351\200\211\346\213\251\345\231\250.md"
new file mode 100644
index 0000000..e9b52f9
--- /dev/null
+++ "b/\351\231\206\346\273\242\351\222\260/20241023-\351\200\211\346\213\251\345\231\250.md"
@@ -0,0 +1,124 @@
+## 属性选择器
+
+1. E[title] 选中页面的E元素，并且E存在 title 属性即可。
+
+2. E[title="abc"]选中页面的E元素，并且E需要带有title属性，且属性值完全等于abc。
+
+3. E[attr~=val] 选择具有 att 属性且属性值为：用空格分隔的字词列表，其中一个等于 val 的E元素。
+
+4. E[attr|=val] 表示要么是一个单独的属性值，要么这个属性值是以“-”分隔的。
+
+5. E[title^="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值以 abc 开头。
+
+6. E[title$="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值以 abc 结尾。
+
+7. E[title*="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值任意位置包含abc。
+
+## 结构伪类选择器
+
+1. E[title] 选中页面的E元素，并且E存在 title 属性即可。
+
+2. E[title="abc"]选中页面的E元素，并且E需要带有title属性，且属性值完全等于abc。
+
+3. E[attr~=val] 选择具有 att 属性且属性值为：用空格分隔的字词列表，其中一个等于 val 的E元素。
+
+4. E[attr|=val] 表示要么是一个单独的属性值，要么这个属性值是以“-”分隔的。
+
+5. E[title^="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值以 abc 开头。
+
+6. E[title$="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值以 abc 结尾。
+
+7. E[title*="abc"] 选中页面的E元素，并且E需要带有 title 属性,属性值任意位置包含abc。
+
+8. E:first-of-type 匹配同类型中的第一个同级兄弟元素E。
+
+9. E:last-of-type 匹配同类型中的最后一个同级兄弟元素E。
+
+10. E:nth-of-type(n) 匹配同类型中的第n个同级兄弟元素E。
+
+11. E:nth-last-of-type(n) 匹配同类型中的倒数第n个同级兄弟元素E。
+
+12. E:empty 匹配没有任何子节点（包括空格等text节点）的元素E。
+
+13. E:target 匹配相关URL指向的E元素。要配合锚点使用。
+
+## 伪元素选择器
+
+1. E::before 设置在 元素E 前面（依据对象树的逻辑结构）的内容，配合content属性一起使用。
+
+2. E::after 设置在 元素E 后面（依据对象树的逻辑结构）的内容，配合content属性一起使用
+
+3. E::first-letter 设置元素 E 里面的第一个字符的样式。
+
+4. E::first-line 设置元素 E 里面的第一行的样式。
+
+5. E::selection 设置元素 E 里面被鼠标选中的区域的样式（一般设置颜色和背景色）。
+
+## 作业效果图
+
+
+## 主要代码
+```html
+
+
+
+
+
+ Document
+
+
+
+
+
+
+```
\ No newline at end of file
diff --git "a/\351\231\206\346\273\242\351\222\260/20241024-\345\212\250\347\224\273.md" "b/\351\231\206\346\273\242\351\222\260/20241024-\345\212\250\347\224\273.md"
new file mode 100644
index 0000000..18ab91b
--- /dev/null
+++ "b/\351\231\206\346\273\242\351\222\260/20241024-\345\212\250\347\224\273.md"
@@ -0,0 +1,323 @@
+## 过渡:transition
+
+1. transition-property: all; 如果希望所有的属性都发生c，就使用all。
+2. transition-duration: 1s; 过渡的持续时间。
+3. transition-timing-function: linear; 运动曲线。属性值可以是：
+ - linear 线性
+ - ease 减速
+ - ease-in 加速
+ - ease-out 减速
+ - ease-in-out 先加速后减速
+4. transition-delay: 1s; 过渡延迟。多长时间后再执行这个过渡动画。
+
+## 缩放：scale
+1. 格式：
+ - transform: scale(x, y);
+ - transform: scale(2, 0.5);
+2. 参数解释：
+ - x：表示水平方向的缩放倍数。
+ - y：表示垂直方向的缩放倍数。
+ - 如果只写一个值就是等比例缩放。
+3. 取值：大于1表示放大，小于1表示缩小。不能为百分比。
+
+## 位移：translate
+1. 格式：
+ - transform: translate(水平位移, 垂直位移);
+ - transform: translate(-50%, -50%);
+2. 参数解释：
+ - 参数为百分比，相对于自身移动。
+ - 正值：向右和向下。
+ - 负值：向左和向上。
+ - 如果只写一个值，则表示水平移动。
+
+## 旋转：rotate
+1. 格式：
+ - transform: rotate(角度);
+ - transform: rotate(45deg);
+2. 参数解释：
+ - 正值 顺时针；
+ - 负值：逆时针。
+
+## 效果图
+
+
+## 主要代码
+```html
+
+
+
+
+ CSS 过渡
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
1
+
+
+
+
+```
+
+
+## 效果图
+
+
+## 主要代码
+```html
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+