Less.js: يؤدي استخدام CSS3 background-size ضمن خاصية الاختزال "background" إلى حدوث خطأ في بناء الجملة

تم إنشاؤها على ١٠ يناير ٢٠١٣ · 7تعليقات · مصدر: less/less.js

يمكن تضمين خاصية CSS3 الجديدة background-size في إعلان الاختزال background بفصلها عن مواصفات background-position بشرطة مائلة للأمام ، كما يلي:

div {
    background: url('/path/to/image.png') left center / contain no-repeat;
}

والنتيجة هي خطأ في بناء الجملة ، على الرغم من أن المحلل اللغوي يختنق بشكل واضح في الجزء / contain - تؤدي إزالته أيضًا إلى اختفاء الخطأ.

بالطبع من الممكن حل هذه المشكلة عن طريق الهروب من القيمة الكاملة للخاصية background مع ~"…" ، لكن سيكون من الجيد حقًا أن تكون قادرًا على استخدام الصيغة الافتراضية دون قيود.

bug medium priority

مصدر

yggi49

التعليق الأكثر فائدة

@ gpv- ديف

تكون النتيجة متوقعة إذا قمت بتجميع الخيار بدون --strict-math=on . الآن لمثل هذه البيانات (مع استثناء واحد أو اثنين ، على سبيل المثال ، خاصية font ) ، يجب عليك استخدام إما --strict-math=on أو وضع بعض الهروب لـ / ، على سبيل المثال: ~"0/100%" .

seven-phases-max في ٧ يناير ٢٠١٥

👍2

ال 7 كومينتر

يبدو وكأنه حالة فرعية لـ PR # 915 ، لكن لم يكن هناك أي أخبار عن ذلك لفترة من الوقت ...

plumbojumbo في ١٦ يناير ٢٠١٣

نعم ، بالضبط ، لهذا السبب سيكون في 1.4.0. سآخذ على # 915 إذا لم يكمل dmcass ذلك.

lukeapage في ١٦ يناير ٢٠١٣

ثابت على ماستر

lukeapage في ٢ فبراير ٢٠١٣

يبدو أنني أواجه هذه المشكلة في 2.1.1.

/* less */
#header {
    height: 50px;
    width: 100%;
    padding: 0 10px;
    font-size: 20px;
    background: url("/img/nav-back.jpg") 0 0/100%;
    position: fixed;
}

/* compiled css */
#header {
    height: 50px;
    width: 100%;
    padding: 0 10px;
    font-size: 20px;
    background: url("/img/nav-back.jpg") 0 0;
    position: fixed;
}

يعمل على Linux Mint 17 Qiana باستخدام lessc 2.1.1.

yang-jandro في ٧ يناير ٢٠١٥

@ gpv- ديف

seven-phases-max في ٧ يناير ٢٠١٥

👍2

@ سبع مراحل كحد أقصى

شكرا على الاستجابة السريعة. اقتراحك كان بالضبط ما احتاجه.

yang-jandro في ٨ يناير ٢٠١٥

شكرًا @ سبع مراحل كحد أقصى ، لقد نجحت في العمل:
url(/assets/img/logos/foo.png) 0 0 / ~"167px auto" no-repeat;
url(/assets/img/logos/foo.png) 0 0 / contain no-repeat;