ForHosting KIT · أدوات المطورين

منسق CSS

تحوّل أداة تجميل CSS أوراق الأنماط المضغوطة أو سيئة التنسيق إلى شفرة أسهل قراءةً ومراجعةً وصيانةً.

● Betaمجاني · داخل متصفحك

استخدمها من الويبAPIالبريدTelegramالتطبيق قريبًا

ألصق CSS من ملف إنتاج أو كتلة أنماط مضمّنة أو مشروع قديم، وستحصل على نسخة ذات مسافات بادئة متسقة وتصريحات منفصلة. تحافظ الأداة أثناء الفحص على السلاسل المحاطة بعلامات اقتباس والتعليقات والأقواس المربعة والمستديرة. كما تتحقق من بنية الكتل وتعيد خطأ إدخال عندما لا تتوازن الأقواس المعقوفة الافتتاحية والختامية، مما يساعدكم على اكتشاف النص المنقوص قبل تمريره إلى أداة أخرى.

حوّلوا أوراق الأنماط المضغوطة إلى شفرة مقروءة

غالباً ما يُصغّر CSS المستخدم في الإنتاج لتقليل حجم النقل. يفيد ذلك المتصفح، لكنه يصعّب العمل على البشر. فقد تجتمع المحددات والتصريحات واستعلامات الوسائط والكتل المتداخلة في سطر واحد، فيصبح فحص تعديل صغير مهمة مرهقة. تعيد هذه الأداة بنية بصرية يمكن توقعها: يبدأ كل قوس معقوف افتتاحي كتلة ذات مسافة بادئة، وتبدأ كل فاصلة منقوطة تنهي تصريحاً سطراً جديداً، ويعيد كل قوس ختامي مستوى المسافة السابق. توحّد الأداة المسافات العادية من دون تغيير النص داخل السلاسل أو التعليقات. تفيد النتيجة عندما يكون مفتش المتصفح أو مجلد البناء أو قالب بريد أو سمة خارجية هو المصدر الوحيد المتاح. وبدلاً من إدخال فواصل الأسطر يدوياً وعدّ الكتل المتداخلة، تحصلون على تمثيل ثابت يمكن قراءته أو نسخه إلى محرر. لا تدّعي العملية التحقق من كل قواعد CSS، ولا تعيد ترتيب التصريحات أو تغير اختيارات التصميم؛ بل تركز على إظهار بنية النص المرسل بوضوح.

كيف تحمي الأداة قيم CSS أثناء التنسيق

يجب أن تدرك أداة التنسيق الآمنة أن علامات الترقيم لا تتحكم دائماً في بنية ورقة الأنماط. فالفاصلة المنقوطة داخل قيمة مقتبسة جزء من المحتوى وليست نهاية تصريح. والأقواس المعقوفة داخل سلسلة أحرف مجرد محارف، كما يجب ألا تُعامل علامات الترقيم داخل دالة، مثل عنوان بيانات، على أنها فواصل بين الخصائص. لذلك تفحص الأداة المصدر محرفاً بعد محرف، وتتابع السلاسل ومحارف الهروب والتعليقات والأقواس المستديرة والمربعة. ولا تضيف فواصل بنيوية إلا عندما تظهر علامة الترقيم خارج تلك السياقات المحمية. وهكذا تبقى العناوين المضمّنة ومحددات السمات والتسميات والدوال المعقدة سليمة، بينما تصبح الكتل المعتادة واضحة. تبقى التعليقات إلى جوار الشفرة بدلاً من حذفها. العملية حتمية؛ فالإدخال نفسه ينتج دائماً الإخراج نفسه من دون اتصال بالشبكة أو استخدام للوقت أو العشوائية أو سلوك يعتمد على بيئة التشغيل.

اكتشفوا الكتل الناقصة قبل الخطوة التالية

يعمل التجميل أيضاً فحصاً بنيوياً عندما يُنسخ CSS من استجابة جزئية أو لوحة في المتصفح أو ملف مولّد. يعدّ الماسح كل قوس معقوف بنيوي افتتاحي وختامي، ويتجاهل الأقواس التي تقع داخل السلاسل والتعليقات والأقواس المستديرة أو المربعة. إذا ظهر قوس ختامي قبل افتتاح مطابق، يفشل الطلب ويحدد موضع المحرف. وإذا انتهى الفحص مع بقاء كتل مفتوحة، يذكر الخطأ عدد الكتل غير المغلقة. هذا التحقق محدود عن قصد؛ فتوازن الأقواس لا يضمن صحة كل خاصية أو قيمة أو محدد أو قاعدة في متصفح بعينه. لكنه يضمن ألا تعرض الأداة كتلة مبتورة بوضوح على أنها نتيجة ناجحة. استخدموا الإخراج النظيف للمراجعة أو المقارنة في نظام التحكم بالإصدارات أو التوثيق أو التحقق الإضافي. الاستخدام داخل المتصفح مجاني، أما التنسيق الآلي عبر API فيطبق السعر الأساسي المنشور وقدره $0.002 لكل طلب.

حالات الاستخدام

فحص ملف إنتاج مصغّر

وسّعوا ورقة أنماط مكتوبة في سطر واحد قبل تتبع محدد أو مراجعة تصريح غير متوقع.

إعداد CSS لمراجعة الشفرة

طبّقوا مسافات بادئة ثابتة وافصلوا التصريحات كي تركز المراجعة على السلوك.

التحقق من مقتطف منسوخ

اكتشفوا الأقواس المعقوفة الناقصة أو الزائدة بعد النسخ من مفتش أو قالب أو استجابة مولّدة.

الأسئلة الشائعة

ما الذي تغيّره أداة تجميل CSS؟

توحّد المسافات البنيوية، وتستخدم مسافتين بادئتين للكتل، وتضع التصريحات المنتهية بفاصلة منقوطة في أسطر منفصلة.

هل تغيّر النص داخل السلاسل أو التعليقات؟

لا. تحتفظ الأداة بالسلاسل المقتبسة ومحارف الهروب ومحتوى التعليقات أثناء الفحص.

هل تتحقق الأداة من صياغة CSS كاملة؟

لا. تتحقق من الأقواس البنيوية وحدود التنسيق، لكنها لا تختبر كل محدد أو خاصية أو قيمة أو قاعدة خاصة بالمتصفح.

ماذا يحدث عندما لا تتوازن الأقواس؟

يفشل الطلب بخطأ إدخال غير صالح بدلاً من إعادة CSS منسق جزئياً.

ما تكلفة طلب API؟

يستخدم كل طلب API السعر الأساسي المنشور وقدره $0.002. ويمكن تشغيل نسخة المتصفح محلياً من دون استدعاء API.

للمطوّرين — الوصول عبر API

كل ما في هذه الصفحة متاح برمجيًا. هذا القسم موجّه للفرق التقنية التي تريد ربط الأداة بأنظمتها الخاصة؛ بقية المستخدمين يمكنهم استخدام الأداة أعلاه مباشرة دون الحاجة لقراءة ما يلي.

الـEndpoint

POSThttps://api.kit.forhosting.com/dev2/beautify-css

صادِق على طلبك بترويسة Bearer، وأرسل طلب POST واحدًا لتدخل مهمتك قائمة التنفيذ فورًا؛ ثم تستلم النتيجة عبر webhook أو رابط موقّع.

استدعِ الخدمة من بيئتك

curl -X POST https://api.kit.forhosting.com/dev2/beautify-css \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"css":"body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"}'

const res = await fetch("https://api.kit.forhosting.com/dev2/beautify-css", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "css": "body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/dev2/beautify-css",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "css": "body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/dev2/beautify-css", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"css":"body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"css":"body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/dev2/beautify-css", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

مثال على الطلب

{
  "css": "body{margin:0;color:#222}@media (max-width:600px){body{margin:1rem}}"
}

مثال على الاستجابة

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "dev2.beautify_css",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

الواجهة غير متزامنة: تستلم task_id فور الإرسال، ويمكنك الاستعلام عن الحالة بمعدل طلب واحد في الثانية.

الأسعار

لكل طلب$0.002

السعر معلن كما تراه: لا tokens ولا نظام نقاط؛ وإن فشلت المهمة فلن تُحاسَب عليها.

الأخطاء

HTTP	الرمز	المعنى
`401`	`unauthorized`	مفتاح الوصول مفقود أو غير صالح؛ تحقق من ترويسة Bearer في طلبك.
`402`	`insufficient_balance`	رصيدك لا يكفي لتنفيذ هذه المهمة؛ أعد شحن الرصيد ثم أعد المحاولة.
`404`	`unknown_type`	نوع المهمة المطلوب غير موجود في الكتالوج — راجع الاسم المرسل في الطلب.
`429`	`rate_limited`	تجاوزت الحد المسموح من الطلبات؛ انتظر قليلًا ثم أعد المحاولة.

اطّلع على توثيق KIT الكامل ←