منسق CSS
نسّق CSS مع الحفاظ على المحددات والتعريفات والتعليقات والقيم وبنية قواعد at-rule.
Make CSS easier to review
قد تخفي CSS المضغوطة المحددات والتعريفات والتعليقات والقيم الطويلة في سطر واحد. يعرض هذا المنسق تخطيطاً مقروءاً للمراجعة.
يغيّر التنسيق العرض ولا يثبت صحة CSS أو كفاءتها أو الوصول أو توافق المتصفح. احتفظ بالمصدر وراجع diff.
استخدم عينة فيها محددات وتعريفات وتعليقات وcustom properties وmedia queries وقيم مقتبسة.
Formatting is not CSS validation
تتكون CSS من selectors وdeclarations وvalues وcomments وat-rules وfunctions وcustom properties وblocks. تجعل المسافات حدودها أوضح.
يرتب المنسق whitespace وtokens لكنه لا يثبت المطابقة أو specificity أو accessibility أو الأداء أو توافق أدوات البناء.
قد تحتوي القيم على strings وURLs وescapes وgradients وvariables وامتدادات المورد؛ حافظ عليها واختبر الهدف.
How to format CSS
- ألصق stylesheet كاملة أو جزءاً مدعوماً.
- افحص selectors والأقواس والتعريفات والتعليقات والخصائص المخصصة والدوال وat-rules.
- قارن أسماء الخصائص والقيم والاقتباسات وURLs والمراجع وترتيب القواعد بالمصدر.
- شغّل linter وbuild وفحوص الوصول والمتصفح.
- أزل URLs الخاصة والtokens وبيانات المستخدم من العينات.
Formatting method
- يقرأ selectors وdeclarations
يقرأ selectors وdeclarations وvalues وcomments وblocks وfunctions وat-rules.
- يضيف أسطر ومسافات
يضيف أسطر ومسافات بادئة لتسهيل فحص القواعد والكتل المتداخلة.
- يحافظ على values
يحافظ على values وstrings وURLs وcustom properties والتعليقات وترتيب القواعد.
يجب تأكيد recovery ودعم dialect وامتدادات vendor والتعليقات وسياسة whitespace ورسائل الخطأ بمحرك حي.
Read the formatted result
النتيجة الناجحة ترتيب مقروء لـ CSS. طابق المحددات والتعريفات والقيم والتعليقات والكتل والدوال وترتيب القواعد بالمصدر.
الفشل لا يثبت دعم parser أو recovery دقيقاً.
مشكلة المتصفح أو linter أو build منفصلة؛ التنسيق ليس تحسيناً للأداء.
أخطاء شائعة
اعتبار المسافات تحققاً من CSS قد يخفي قيمًا غير صالحة أو مفاجآت specificity أو مشاكل وصول.
تغيير custom property أو string أو URL أو escape أو ترتيب القواعد قد يغير السلوك.
افتراض تطابق امتداد vendor في كل الأدوات قد يؤدي إلى stylesheet مضلل.
لصق URLs خاصة أو tokens أو styles مرتبطة بمستخدم يكشف بيانات حساسة.
الحدود والحالات الخاصة
القدرة هي تنسيق عرض CSS ولا تضمن validation أو linter أو accessibility أو security أو performance أو compatibility أو minification.
اختبر custom properties وat-rules وvendor extensions والدوال والescapes والتعليقات والملفات الكبيرة.
لا تلصق styles إنتاج سرية دون سياسة تسمح بذلك.
Examples
هل يتحقق التنسيق من CSS؟
هل يتحقق التنسيق من CSS؟
ألصق stylesheet كاملة أو جزءاً مدعوماً.
النتيجة الناجحة ترتيب مقروء لـ CSS. طابق المحددات والتعريفات والقيم والتعليقات والكتل والدوال وترتيب القواعد بالمصدر.
هل يغير cascade؟
هل يغير cascade؟
افحص selectors والأقواس والتعريفات والتعليقات والخصائص المخصصة والدوال وat-rules.
الفشل لا يثبت دعم parser أو recovery دقيقاً.
هل تُحفظ القيم؟
هل تُحفظ القيم؟
قارن أسماء الخصائص والقيم والاقتباسات وURLs والمراجع وترتيب القواعد بالمصدر.
مشكلة المتصفح أو linter أو build منفصلة؛ التنسيق ليس تحسيناً للأداء.
هل تُحفظ التعليقات؟
هل تُحفظ التعليقات؟
شغّل linter وbuild وفحوص الوصول والمتصفح.
النتيجة الناجحة ترتيب مقروء لـ CSS. طابق المحددات والتعريفات والقيم والتعليقات والكتل والدوال وترتيب القواعد بالمصدر.
هل يمكن تنسيق media query؟
هل يمكن تنسيق media query؟
أزل URLs الخاصة والtokens وبيانات المستخدم من العينات.
الفشل لا يثبت دعم parser أو recovery دقيقاً.
هل يحسن الأداء؟
هل يحسن الأداء؟
ألصق stylesheet كاملة أو جزءاً مدعوماً.
مشكلة المتصفح أو linter أو build منفصلة؛ التنسيق ليس تحسيناً للأداء.
Frequently asked questions
هل يتحقق التنسيق من CSS؟
لا. استخدم parser وlinter وbuild وفحوص الوصول والمتصفح.
هل يغير cascade؟
المفترض أن تتغير مسافات العرض؛ قارن ترتيب القواعد واختبر لأن parsing قد يتأثر.
هل تُحفظ القيم؟
تحافظ الأمثلة على values وstrings وURLs وfunctions؛ راجع diff عند أهمية النص.
هل تُحفظ التعليقات؟
تحتفظ الأمثلة بالتعليقات؛ أكد السلوك على إدخالك.
هل يمكن تنسيق media query؟
يعرض المثال at-rule متداخلاً؛ أكد دعم الصياغة.
هل يحسن الأداء؟
لا. استخدم تحليل build وprofiling وتحسيناً موجهاً.
هل يصلح CSS التالف؟
لا تفترض الإصلاح الآلي؛ أصلح المصدر وتحقق بالأدوات.
ماذا أفعل بعد التنسيق؟
راجع diff وشغّل linter وbuild وفحوص الوصول والمتصفح.