diff --git "a/\345\221\250\346\227\255/20241025\342\200\224\342\200\224\345\261\236\346\200\247\350\257\246\350\247\243\357\274\214\345\212\250\347\224\273\350\257\246\350\247\243.md" "b/\345\221\250\346\227\255/20241025\342\200\224\342\200\224\345\261\236\346\200\247\350\257\246\350\247\243\357\274\214\345\212\250\347\224\273\350\257\246\350\247\243.md"
new file mode 100644
index 0000000000000000000000000000000000000000..3aff00457685c446bbff0f7cf06759fa34a9ba23
--- /dev/null
+++ "b/\345\221\250\346\227\255/20241025\342\200\224\342\200\224\345\261\236\346\200\247\350\257\246\350\247\243\357\274\214\345\212\250\347\224\273\350\257\246\350\247\243.md"
@@ -0,0 +1,364 @@
+# 属性详解
+
+## 文本
+
+### text-shadow：设置文本的阴影
+
+格式举例：text-shadow:20px 27px 22px pink；
+
+参数解释：水平位移 垂直位移 模糊程度 阴影颜色
+
+### 盒模型中的box-sizing属性
+
+**外加模式：**（css的默认方式）：box-sizing: content-box;
+
+*内减模式：**【需要注意】：box-sizing: border-box
+
+#### 处理兼容性问题：私有前缀
+
+**为浏览器添加不同的私有前缀**，属性就可以生效了
+
+```
+ -webkit-: 谷歌 苹果
+ -moz-:火狐
+ -ms-：IE
+ -o-：欧朋
+```
+
+## 边框
+
+### 边框圆角：`border-radius` 属性
+
+边框的每个圆角，本质上是一个圆，圆有**水平半径**和**垂直半径**：如果二者相等，就是圆；如果二者不等， 就是椭圆。
+
+### 边框阴影：`box-shadow` 属性
+
+```
+边框阴影：`box-shadow` 属性
+```
+
+参数解释：
+
+- 水平偏移：正值向右 负值向左。
+
+- 垂直偏移：正值向下 负值向上。
+
+- 模糊程度：不能为负值。
+
+### 边框图片
+
+```
+/* 边框图片的路径*/
+ border-image-source: url("images/border.png");
+
+ /* 图片边框的裁剪*/
+ border-image-slice: 27;
+
+ /*图片边框的宽度*/
+ border-image-width: 27px;
+
+ /*边框图片的平铺*/
+ /* repeat :正常平铺 但是可能会显示不完整*/
+ /*round: 平铺 但是保证 图片完整*/
+ /*stretch: 拉伸显示*/
+ border-image-repeat: stretch;
+```
+
+我们也可以写成一个综合属性:
+
+```
+ border-image: url("images/border.png") 27/20px round;
+```
+
+# CSS3属性详解：动画详解
+
+## 过渡：transition
+
+`transition`的中文含义是**过渡**。过渡是CSS3中具有颠覆性的一个特征，可以实现元素**不同状态间的平滑过渡**（补间动画），经常用来制作动画效果。
+
+```
+transition: 让哪些属性进行过度 过渡的持续时间 运动曲线 延迟时间;
+
+transition: all 3s linear 0s;
+```
+
+
+
+## 2D 转换 transform
+
+**转换**是 CSS3 中具有颠覆性的一个特征，可以实现元素的**位移、旋转、变形、缩放**，甚至支持矩阵方式。
+
+### 1、缩放：`scale`
+
+```
+transform: scale(x, y);
+
+transform: scale(2, 0.5);
+```
+
+参数解释： x：表示水平方向的缩放倍数。y：表示垂直方向的缩放倍数。如果只写一个值就是等比例缩放。
+
+取值：大于1表示放大，小于1表示缩小。不能为百分比。
+
+### 位移：translate
+
+```
+ transform: translate(水平位移, 垂直位移);
+
+ transform: translate(-50%, -50%);
+```
+
+参数解释：
+
+- 参数为百分比，相对于自身移动。
+
+- 正值：向右和向下。 负值：向左和向上。如果只写一个值，则表示水平移动。
+
+### 旋转：rotate
+
+```
+ transform: rotate(角度);
+
+ transform: rotate(45deg);
+```
+
+参数解释：正值 顺时针；负值：逆时针。
+
+
+
+## 3D 转换 transform
+
+## 动画：animation
+
+
+# 作业
+
+## 作业1
+
+```
+ body {
+ margin: 0;
+ padding: 0;
+ background-color: #eeeeee;
+ }
+
+ .total{
+ width: 800px;
+ height: 320px;
+ padding-left: 20px;
+ margin: 80px auto;
+ }
+
+ div{
+ margin-right: 20px;
+ text-align: center;
+ float: left;
+ transform: all 2s linear 0s;
+ border-radius: 10%;
+ background-color: #fff;
+ position: relative;
+ top: 0;
+ overflow: hidden;
+ width: 230px;
+ height: 300px;
+ transition: all .5s;
+
+ }
+
+ .d1:hover{
+ box-shadow: 0 0 15px #AAA;
+ top:-5px;
+ }
+
+ .d1 .clr{
+ position: absolute;
+ left: 0;
+ bottom: -80px;
+ width: 100%;
+ height: 80px;
+ background-color: #ff6700;
+ transition: all .5s;
+ }
+
+ .d1:hover .clr {
+ bottom: 0;
+ }
+
+ .d1 img {
+ margin-top: 30px;
+ }
+
+
+
+
+
+```
+
+
+
+## 作业2
+
+```
+ .d1{
+ background-color: red;
+ width: 200px;
+ height: 200px;
+ color: white;
+ font-size: 48px;
+ margin-top: 30px;
+ margin-left: 45%;
+ transition: all 2s;
+ }
+
+ .d1:hover{
+ transform: rotate(-100000deg);
+ }
+
+```
+
+
+
+
+## 作业3
+
+```
+ body{
+ width: 100%;
+ height: 100%;
+ background-color: orange;
+ }
+ img{
+ margin-top: 600px;
+ transition: all 3s;
+ transform:rotate(45deg);
+}
+ .hj:hover img{
+ transform: translate(900px,-300%) rotate(45deg);
+ }
+
+
+
+
+
+
