From d442511366a70d3176a32f1efce2bbd9911f4a72 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=9F=E6=96=87=E6=B7=AF?= <14131014+jiang-wenyu0212@user.noreply.gitee.com> Date: Wed, 9 Oct 2024 10:56:18 +0800 Subject: [PATCH 1/4] 1009 --- .../20241009-css\346\270\220\345\217\230.md" | 60 ++++++++++++++++++ ...ght-Mandarin-DV2917-800-Release-Date.jpeg" | Bin .../\345\233\276\347\211\207/image-1.png" | Bin .../\345\233\276\347\211\207/image-2.png" | Bin .../\345\233\276\347\211\207/image-3.png" | Bin .../\345\233\276\347\211\207/image-4.png" | Bin .../\345\233\276\347\211\207/image-5.png" | Bin .../\345\233\276\347\211\207/image-6.png" | Bin .../\345\233\276\347\211\207/image.png" | Bin 9 files changed, 60 insertions(+) create mode 100644 "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241009-css\346\270\220\345\217\230.md" rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" (100%) diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241009-css\346\270\220\345\217\230.md" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241009-css\346\270\220\345\217\230.md" new file mode 100644 index 0000000..b367ac8 --- /dev/null +++ "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241009-css\346\270\220\345\217\230.md" @@ -0,0 +1,60 @@ +## 渐变 +1. 渐变分为线性渐变与径向渐变 +- 线性渐变 ： 向下/向上/向左/向右对角方向 +- 径向渐变 ： 由他们的中心定义 +## 线性渐变 +1. 为了创建一个线性渐变，你必须至少定义两种颜色节点。颜色节点即你想要呈现平稳过渡的颜色。同时，你也可以设置一个起点和一个方向（或一个角度） +2. 语法 ：background-image: linear-gradient(direction,color-stopl, color-stop2,.....); +- 线性渐变 - 从上到下（默认情况下） +- 下面的实力演示了从顶部开始的线性渐变。起点是红色，慢慢过渡到蓝色 +- #grad{ +- background-image: linear-gradiient(#e66465, #9198e5): +- } +- 线性渐变-从左到右 +- #grad{ +- height: 200px ; +- background-image: linear-gradiient(to right, red , yellow): +- } +- 线性渐变-对角 +- #grad{ +- height: 200px ; +- background-image: linear-gradiient(to bottom right , red , yellow): +- } +- 使用角度 +- #grad{ +- background-image: linear-gradiient(90deg , red , yellow): +- } +- 使用多个颜色节点 +- #grad{ +- background-image: linear-gradiient(yed, yellow, green): +- } +- 下面的实例演示了如何创建一个带有彩虹颜色的文本和线性渐变 +- #grad { +- /* 标准的语法 */ +- background-image: linear-gradient(to right, red,orange,yellow,green,blue,- indigo,violet); +- } +## 径向渐变 （径向渐变由它的中心定义） +1. 为了创建一个径向渐变，你也必须至少定义两种颜色节点。颜色节点即你想要呈现平稳过渡的颜色。同时你也可以指定渐变的中心、形状、大小。默认情况下，渐变的中心是center（表示在中心点），渐变的形状是ellipse（表示椭圆形），渐变的大小是farthest-corner（表示到最远的角落）。 +- 语法 ：background-image: radial-gradient(shape size at position, start-color, ..., last-color); +- 径向渐变 - 颜色节点均匀分布（默认情况下） +- 实例： 颜色节点均匀分布的径向渐变： +-#grad { +- background-image: radial-gradient(red, yellow, green); +- } +- 实例：颜色节点分布不均匀地径向渐变 +-#grad { +- background-image: radial-gradient(red 5%, yellow 15%, green 60 %); +- } +- 设置形状 +- shape 参数定义了形状。他可以是值circle 或ellipse 。 其中 ， circle 表示圆形 ， ellipse 表示椭圆形 ， 默认值是ellipse +- 实例 ： 形状为圆形的径向渐变： +-#grad { +- background-image: radial-gradient(circle， red, yellow, green); +- } +- 重复的径向渐变 +- repeating-radial-gradient()函数用于重复径向渐变 +- 实例 ：一个重复的径向渐变 +-#grad { +- background-image: repeating-radial-gradient(red, yellow, green); +- } + diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" -- Gitee From 92dad268e9757852bbae5de5550fdbab890710ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=9F=E6=96=87=E6=B7=AF?= <14131014+jiang-wenyu0212@user.noreply.gitee.com> Date: Wed, 9 Oct 2024 11:36:38 +0800 Subject: [PATCH 2/4] 1009 --- ...\351\241\271\347\273\203\344\271\240.html" | 35 ++++++++++++++++++ ...ght-Mandarin-DV2917-800-Release-Date.jpeg" | Bin .../image-1.png" | Bin .../image-2.png" | Bin .../image-3.png" | Bin .../image-4.png" | Bin .../image-5.png" | Bin .../image-6.png" | Bin .../image.png" | Bin 9 files changed, 35 insertions(+) create mode 100644 "\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" (100%) diff --git "a/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" "b/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" new file mode 100644 index 0000000..7b03615 --- /dev/null +++ "b/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" @@ -0,0 +1,35 @@ + + + + + + Document + + + +
+
+ 中华人民共和国 +
+ + \ No newline at end of file diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-1.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-2.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-3.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-4.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-5.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image-6.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\345\233\276\347\211\207/image.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" -- Gitee From 61a4f02940151da93b2f84278eb76f019ee43617 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=9F=E6=96=87=E6=B7=AF?= <14131014+jiang-wenyu0212@user.noreply.gitee.com> Date: Wed, 9 Oct 2024 23:51:33 +0800 Subject: [PATCH 3/4] 1009 --- ...\223\351\241\271\347\273\203\344\271\240.html" | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git "a/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" "b/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" index 7b03615..afd8038 100644 --- "a/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" +++ "b/\346\261\237\346\226\207\346\267\257/\344\275\234\344\270\232/\347\272\277\346\200\247\346\270\220\345\217\230\344\270\223\351\241\271\347\273\203\344\271\240.html" @@ -10,6 +10,10 @@ height: 60px; border: 1px solid; margin-top: 10px; + margin: 0; + padding: 0; + + overflow: hidden; } .box1{ background-image: linear-gradient(45deg, yellow 0%, yellow 25%, blue 25%, blue 50%, red 50%, red 75%, green 75%, green 100%); @@ -24,12 +28,21 @@ background-clip: text; color: transparent; } + .box3{ + width: 500px; + height: 100px; + background: + linear-gradient(45deg, white 25%, transparent 25%, transparent 75%, white 75%, white 100%), + linear-gradient(45deg, white 25%, red 25%, red 75%, white 75%, white 100%); + background-size: 40px 40px; /* 格子的大小 */ + background-position: 0 0, 20px 20px; /* 背景层的偏移 */ + }
中华人民共和国 -
+
\ No newline at end of file -- Gitee From c163d307c9c9827c86ccab6dd91578fdbe25c5da Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B1=9F=E6=96=87=E6=B7=AF?= <14131014+jiang-wenyu0212@user.noreply.gitee.com> Date: Sat, 12 Oct 2024 16:32:26 +0800 Subject: [PATCH 4/4] 1012 --- ...50\346\240\267\345\274\217\350\241\250.md" | 99 ++++++++++++++++++ ...ght-Mandarin-DV2917-800-Release-Date.jpeg" | Bin .../\347\254\224\350\256\260/image-1.png" | Bin .../\347\254\224\350\256\260/image-2.png" | Bin .../\347\254\224\350\256\260/image-3.png" | Bin .../\347\254\224\350\256\260/image-4.png" | Bin .../\347\254\224\350\256\260/image-5.png" | Bin .../\347\254\224\350\256\260/image-6.png" | Bin .../\347\254\224\350\256\260/image.png" | Bin 9 files changed, 99 insertions(+) create mode 100644 "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241012-css\351\200\211\346\213\251\345\231\250\346\240\267\345\274\217\350\241\250.md" rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" (100%) rename "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" => "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" (100%) diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241012-css\351\200\211\346\213\251\345\231\250\346\240\267\345\274\217\350\241\250.md" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241012-css\351\200\211\346\213\251\345\231\250\346\240\267\345\274\217\350\241\250.md" new file mode 100644 index 0000000..5e5511a --- /dev/null +++ "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/20241012-css\351\200\211\346\213\251\345\231\250\346\240\267\345\274\217\350\241\250.md" @@ -0,0 +1,99 @@ +## css选择器 +- css选择器规定了css规则会被应用到那些元素上 +- (1)所有的标签都可以是选择器 比如 ul li label dt dl input +- (2)无论这个标签藏得多深一定能够被选上 +- (3)选择的所有 而不是一个 +1. 通用选择器 +- 选择所有元素。可以将其限制为特定的名称空间或者所有名称空间 +- 语法：* ns| * * | * +- 例子：* 讲匹配文档的所有元素 +2. 元素选择器 +- 按照给定的节点名称，选择所有匹配的元素 +- 语法： elementname +- 例子：input匹配任何<input>元素 +3. 类选择器 +- 按照给定的class数学的值，选择所有匹配的元素 +- 语法：.classname +- 例子：.index匹配认识class数学中含有index累的元素 +4. ID选择器 +- 按照ID属性选择一个与之匹配的元素。需要注意的是，一个文档中，每个ID数学都应当是唯一的 +- 语法:#idname +- 例子:#toc匹配ID为“toc”的元素 +5. 属性选择器 +- 按照给定的属性，选择所有匹配的元素 +- 语法：[attr] [attr=value] +- 例子：[autoplay]选择所有具有autoplay属性的元素 +6. 标签选择器：选择器的名字代表HTML页面上的标签 所以经常描述共性，无法描述一某一个元素的个性 +## css的集中高级选择器 +1. 后代选择器：定义的时候用空格隔开 +- 对于 E F 这种格式，表示所有属于E元素后代的F元素，有这个样式。空格就表示后代。 +后代选择器，就是一种平衡共性 特性的平衡。当要把某一个部分的所有的双眸，进行样式改变就要用到后代选择器 +- 举例 1： + +- +- 空格就表示后代 .div1 p 表示 .div1的后代所有的P +## css语法 +- 语法格式： 选择器{属性名:属性值;属性名:属性值;} +- 或者可以写成： + +- 选择器 { +- k: v; +- k: v; +- k: v; +- k: v; +- } +- 选择器 { +- k: v; +- k: v; +- k: v; +- k: v; +- } +- 举例： +- p{ +- color:red +-} +## 字体颜色：（c） + +- color:red; +- color 属性的值，可以是英语单词，比如 red、blue、yellow 等等；也可以是 rgb、十六进制(后期详细讲)。 + +## 字号大小：（fos） + +- font-size:40px; +- font 就是“字体”，size 就是“尺寸”。px 是“像素”。单位必须加，不加不行。 + +## 背景颜色：（bgc） + +- background-color: blue; +- background 就是“背景”。 + +## 加粗：（fwb） + +- font-weight: bold; +- font 是“字体” weight 是“重量”的意思，bold 粗。 + +## 不加粗：（fwn） + +- font-weight: normal; +- normal 就是正常的意思。 + +## 斜体：（fsi） + +- font-style: italic; +- italic 就是“斜体”。 + +## 不斜体：（fsn） + +- font-style: normal; +## 下划线：（tdu） + +- text-decoration: underline; +- decoration 就是“装饰”的意思。 + +## 没有下划线：（tdn） + +- text-decoration:none; \ No newline at end of file diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/Kevin-Durant-Nike-KD-16-Vivid-Orange-Bright-Mandarin-DV2917-800-Release-Date.jpeg" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-1.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-1.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-2.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-2.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-3.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-3.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-4.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-4.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-5.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-5.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image-6.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image-6.png" diff --git "a/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" "b/\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" similarity index 100% rename from "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/\346\226\260\345\273\272\346\226\207\344\273\266\345\244\271/image.png" rename to "\346\261\237\346\226\207\346\267\257/\347\254\224\350\256\260/image.png" -- Gitee