From 81f1a1d1faea9b0887b9541a9ecbe98062d15cd5 Mon Sep 17 00:00:00 2001
From: wengxindong <2092619391@qq.com>
Date: Sun, 27 Oct 2024 15:48:56 +0800
Subject: [PATCH] 10-25tijiao

---
 ...32\344\275\215\345\261\236\346\200\247.md" |  0
 ...43\345\222\214\345\212\250\347\224\273.md" | 73 +++++++++++++++++++
 2 files changed, 73 insertions(+)
 create mode 100644 "\347\277\201\344\277\241\346\240\213/20241018\345\256\232\344\275\215\345\261\236\346\200\247.md"
 create mode 100644 "\347\277\201\344\277\241\346\240\213/20241022-CSS\345\261\236\346\200\247\350\257\246\350\247\243\345\222\214\345\212\250\347\224\273.md"

diff --git "a/\347\277\201\344\277\241\346\240\213/20241018\345\256\232\344\275\215\345\261\236\346\200\247.md" "b/\347\277\201\344\277\241\346\240\213/20241018\345\256\232\344\275\215\345\261\236\346\200\247.md"
new file mode 100644
index 0000000..e69de29
diff --git "a/\347\277\201\344\277\241\346\240\213/20241022-CSS\345\261\236\346\200\247\350\257\246\350\247\243\345\222\214\345\212\250\347\224\273.md" "b/\347\277\201\344\277\241\346\240\213/20241022-CSS\345\261\236\346\200\247\350\257\246\350\247\243\345\222\214\345\212\250\347\224\273.md"
new file mode 100644
index 0000000..0e32eef
--- /dev/null
+++ "b/\347\277\201\344\277\241\346\240\213/20241022-CSS\345\261\236\346\200\247\350\257\246\350\247\243\345\222\214\345\212\250\347\224\273.md"
@@ -0,0 +1,73 @@
+### 结构伪类选择器
+伪类选择器的标志性符号是`:`
+
+CSS中有一些伪类选择器，如：link、:visited、:hover、:active、:focus
+
+**1.格式（重要）(第一部分):**
+- E:first-child：匹配父元素的第一个子元素E
+- E:last-child：匹配父元素的最后一个子元素E
+- E:nth-child(n)：匹配父元素的第n个子元素E
+- E:nth-child(odd)：匹配奇数
+- E:nth-child(even)：匹配偶数
+- E:nth-last-child(n)：匹配父元素的倒数第n个子元素E
+
+**2.格式：（第二部分）**
+- E:first-of-type：匹配同类型中的第一个同级兄弟元素E
+- E:last-of-type：匹配同类型中的最后一个同级兄弟元素E
+- E:nth-of-type(n)：匹配同类型中的第n个同级兄弟元素E
+- E:nth-last-of-type(n)：匹配同类型中的倒数第n个同级兄弟元素E
+
+**3.格式：（第三部分）**
+- E:empty：匹配没有任何子节点（包括空格等text节点）的元素E
+- E:target：匹配相关URL指向的E元素
+### 伪元素选择器
+伪元素选择器的标志性符号是`::`
+
+**1.格式：（第一部分）**
+- E::before：设置在元素E前面（依据对象树的逻辑结构）的内容，配合content属性一起使用
+- E::after：设置在元素E后面（依据对象树的逻辑结构）的内容，配合content属性一起使用
+
+**2.格式：（第二部分）**
+- E::fist-letter：是指元素E里面的第一个字符的样式
+- E::fist-line：是指元素E里面的第一行的样式
+- E::selection：设置元素E里面被鼠标选中的区域的样式（一般设置颜色和背景色）
+## 文本
+### text-shadow：设置文本的阴影
+**语法：**text-shadow：水平位移 垂直位移 模糊程度 阴影颜色
+### 盒模型中的box-sizing属性
+- 外加模式：（css的默认方式）box-sizing:content-box;
+
+注：此时设置的width和height是**内容区域**的宽高，盒子的实际宽度=设置的width+padding+border，此时改变padding和border的大小，也不会改变内容的宽高，而是盒子的总宽高发生变化
+
+- 内减模式：（注意）box-sizing:border-box;
+
+注：此时设置的width和height是**盒子**的总宽高，盒子的实际宽度=设置的width，此时改变padding和border的大小，会改变内容的宽高，盒子的总宽高不变
+### 边框
+边框的属性很多，其中**边框圆角**和*边框阴影**应用十分广泛
+### 边框圆角：border-radius属性
+边框的每个圆角，本质上是一个圆，圆有**水平半径**和**垂直半径**，如果二者相等，就是圆；如果二者不等，就是椭圆
+### 边框阴影：box-shadow属性
+语法：box-shadow:水平偏移 垂直偏移 模糊程度 阴影大小 阴影颜色
+
+注：后面加一个inset属性，表示内阴影，如果不写，则默认表示外阴影
+
+## 过渡：transition
+transition含义是过渡，可以实现元素**不同状态间的平滑过渡**（补间动画）
+
+transition包括以下属性：
+- transition-property:all;如果希望所有的属性都发生过渡，就使用all
+- transition-duration:ls;过渡的持续时间
+- transition-timing-function:linear;运动曲线，属性值可以是：
+    - linear 线性
+    - ease 减速
+    - ease-in 加速
+    - ease-out 减速
+    - ease-in-out 先加速后减速
+- transition-delay:1s;过渡延迟
+## 2D转换
+### 缩放：scale
+格式：transform:scale(x,y);
+### 位移：translate
+格式：transform:translate(水平位移，垂直位移);
+### 旋转：rotate
+格式：transform:rotate(角度);
\ No newline at end of file
-- 
Gitee