From 80690fd8fbbb09d04cfc4022bbf3d98cbae739da Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BE=90=E6=B6=9B?= <midnite@outlook.com>
Date: Wed, 30 Jun 2021 15:54:02 +0800
Subject: [PATCH] =?UTF-8?q?enhance:=E5=90=91=E5=93=8D=E5=BA=94=E5=BC=8F?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E6=A1=86=E6=9E=B6=E5=8A=A0=E5=85=A5=E4=B8=80?=
 =?UTF-8?q?=E4=BA=9B=E6=9B=B4=E6=96=B0=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 source/_posts/responsive-flex.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/source/_posts/responsive-flex.md b/source/_posts/responsive-flex.md
index 8e743ea..ee23c5a 100644
--- a/source/_posts/responsive-flex.md
+++ b/source/_posts/responsive-flex.md
@@ -87,13 +87,32 @@ keywords: CSS,Less,响应式,responsive,flex,media
     each(@basis-percent, .(@max) {
         each(range(1, @max), .(@i) {
             .b-@{i}-@{max}-@{media} {
+                # 如果应用在Lesscss 4中，这里需要改成：percentage((@i / @max))，
+                # 因为Lesscss 4在数据计算上有了比较大的修改。
                 flex-basis: percentage(@i / @max);
             }
             .w-@{i}-@{max}-@{media} {
                 width: percentage(@i / @max);
             }
+            .wmax-@{i}-@{max}-@{media} {
+                max-width: percentage(@i / @max);
+            }
+            .wmin-@{i}-@{max}-@{media} {
+                min-width: percentage(@i / @max);
+            }
         });
     });
+    each(range(0, 100), .(@i) {
+        .w-@{i}p-@{media} {
+            width: percentage(@i / @max);
+        }
+        .wmax-@{i}p-@{media} {
+            max-width: percentage(@i / @max);
+        }
+        .wmin-@{i}p-@{media} {
+            min-width: percentage(@i / @max);
+        }
+    };
     @wrap-modes: {
         none: nowrap;
         wrap: wrap;