أسلوب البرمجة يشبه شخصية الشخص. غالبًا ما يكون لدى المبرمجين (المصممين) المختلفين أساليب كتابة مختلفة. الأسلوب الجيد يسهل على الآخرين قبوله. بأخذ سمات WordPress كمثال، قد نفضل استخدام ملفات السمات بأسلوب تعليمات برمجية جيد وبما يتماشى مع ذوقنا. وماذا نفعل عندما يتعين علينا دراسة ملفات CSS الفوضوية التي يصعب قراءتها؟ يمكنك استخدام "Styneat" لإعادة تنظيم وبناء محددات CSS والمحددات الفرعية والخصائص وفقًا لبنية متتالية، مما يجعل ملف CSS أكثر ترتيبًا وقابلية للقراءة، ومن الأسهل تحديد تخطيطات الصفحة ورؤية العلاقات بين الهياكل المختلفة.
يمكن لخدمة إعادة تنظيم تنسيق بنية ملفات "
Styleneat " CSS إعادة تنظيم ملفات CSS ذات أنماط الكتابة الفوضوية في بنية متتالية لتسهيل القراءة والبحث، وهي أداة عملية للغاية عبر الإنترنت.
يمكنك استخدامه بثلاث طرق مختلفة: 1. الصق الكود مباشرة؛ 2. قم بتحميل ملف CSS. 3. أدخل عنوان ملف CSS؛ هناك أيضًا بعض إعدادات الخيارات: الفرز بالترتيب الأبجدي حسب خصائص CSS والمحددات؛ إعادة تنظيم تنسيق CSS المستورد أو متعدد الأسطر؛ تشغيل وضع إعادة التنظيم الآمن.
دعونا نلقي نظرة على تأثير الاستخدام:
الكود الأصلي:
مثال لكود المصدر
[www.downcodes.com]
#menubar .القوائم {
الخلفية:#E9EEF1;
تعويم: يسار؛
الحشو: 0 10 بكسل؛
}
#menubar .القوائم لي {
تعويم: يسار؛
نمط الحدود: صلب؛
لون الحدود: #FFF؛
عرض الحدود: 0 1 بكسل؛
الهامش الأيسر:-1px;
نوع نمط القائمة: لا شيء؛
}
#menubar .menus li a {display:block;text-decoration:none;padding:5px 10px;}
#menubar .menus li a:hover {
الخلفية:#EEDDCC؛
نوع نمط القائمة: لا شيء؛
}
#menubar .menus .current_page_item {
الخلفية: #FFF؛
وزن الخط: غامق؛
}
#menubar .menus li.current_page_item a:hover {
الخلفية: #FFF؛
}
الكود المعاد هيكلته:
مثال لكود المصدر
[www.downcodes.com]
#menubar .القوائم {
الخلفية:#E9EEF1;
تعويم: يسار؛
الحشو:0 10 بكسل }
#menubar .القوائم لي {
تعويم: يسار؛
نمط الحدود: صلب؛
لون الحدود: #FFF؛
عرض الحدود: 0 1 بكسل؛
الهامش الأيسر:-1px;
نوع نمط القائمة: لا شيء }
#menubar .القوائم لى {
عرض:كتلة؛
زخرفة النص: لا شيء؛
الحشو: 5 بكسل 10 بكسل }
#menubar .menus li a:hover {
الخلفية:#EEDDCC؛
نوع نمط القائمة: لا شيء }
#menubar .menus .current_page_item {
الخلفية: #FFF؛
وزن الخط: غامق }
#menubar .menus li.current_page_item a:hover { الخلفية:#FFF }