التباعد من حجم الخط والنسبة
يحتاج نص بحجم 16 بكسل ونسبة 1.5 إلى 24 بكسل من خط أساس إلى الخط التالي. وتحصل أيضًا على المسافة الزائدة عن حجم الحرف ونصفها، جاهزة للنماذج وقوالب البريد ومواصفات الطباعة. مجانية في متصفحك.
- مجاني
- يعمل في متصفحك
- دون تسجيل
- بياناتك لا تغادر جهازك
شغّل الأداة مجانًا
مثال محلول
- حجم الخط
- 16
- النسبة
- 1.5
- ارتفاع السطر (px)
- 24
- ارتفاع السطر الإضافي (px)
- 8
- نصف ارتفاع السطر (px)
- 4
- الدقة
- 10
تحوّل حاسبة التباعد بين الأسطر (leading) حجم خط بوحدة بكسل CSS ونسبة line-height بلا وحدة إلى التباعد الدقيق من خط أساس إلى خط أساس بالبكسل—المقياس الطباعي الكلاسيكي المسمّى leading—مع التباعد الإضافي وhalf-leading لحسابات التخطيط. يلجأ المصممون ومطوّرو الواجهة الأمامية إلى هذا المنتج باستمرار: نص الجسم بستّة عشر بكسل بنسبة واحد فاصلة خمسة يحتاج أربعة وعشرين بكسلًا من التباعد؛ وعناوين بثمانية عشر بكسل بنسبة واحد فاصلة ستّة تحتاج ثمانية وعشرين فاصلة ثمانية. الهوية حتمية بالكامل: التباعد بالبكسل يساوي حجم الخط مضروبًا في النسبة، والتباعد الإضافي هو التباعد ناقص حجم الخط، وhalf-leading نصف ذلك الإضافي. لا استدعاء شبكة ولا عيّنة ولا اختصار يعتمد على التاريخ—حساب منتهٍ فقط على عددين موجبين.
معنى التباعد بين الأسطر وما تعيده هذه الحاسبة
التباعد بين الأسطر (leading) هو الإيقاع العمودي للنص: المسافة من خط أساس إلى التالي التي يستخدمها المطابع ومحركات التخطيط وصناديق سطر CSS عند رصّ أسطر الفقرة. تأتي الكلمة من شرائط الرصاص التي وُضعت قديمًا بين الحروف المعدنية؛ وفي التصميم الرقمي غالبًا ما تُكتب الفكرة نفسها line-height، غير أن كثيرًا من ملخصات التصميم ودلائل التحرير وكتب الطباعة ما زالت تطلب leading بوحدات مطلقة.
يمكنكم الإبقاء على نسبة بلا وحدة في طبقة رموز للوراثة، ثم تجسيد قيمة مطلقة بالبكسل عند تصدير نماذج ثابتة أو مواصفات Figma أو قوالب بريد أو ملفات PDF للطباعة لا تستطيع الوراثة. تنفّذ هذه الحاسبة التباعد بالبكسل يساوي حجم الخط مضروبًا في النسبة، وهو بالضبط ما يضربه line-height بلا وحدة في حجم الخط المستخدم. وتُبلغ أيضًا عن التباعد الإضافي—المساحة فوق حجم الجسم، التباعد ناقص حجم الخط—وعن half-leading، نصف ذلك الإضافي، كما تقسّم محركات كثيرة المساحة فوق الحروف وتحتها داخل صندوق السطر.
لا بحث مقاييس OpenType ولا تحويل rem أو em ولا تحليل ملفات خط: تلك مسائل منفصلة.
أين يناسب التباعد بالبكسل أنظمة التصميم وCSS والتعليم
يحوّل مصمّمو المنتج مقياس طباعة نمطيًا إلى تباعد مطلق عند تسليم نماذج الجوال، أو عندما تتجاهل عملاء البريد الوراثة بلا وحدة، أو عندما يجمّد تصدير PDF للطباعة كل قياس بالبكسل أو النقاط. يستطيع المعلّمون في الطباعة وأساسيات CSS أن يُظهروا أن نسبة بلا وحدة واحد فاصلة خمسة عند ستّة عشر بكسل تساوي أربعة وعشرين بكسل تباعد خط أساس، مع ثمانية إضافي وأربعة half-leading، دون الاعتماد على تقريب غامض في DevTools المتصفح.
يحتاج مراجعو إمكانية الوصول أحيانًا فحصًا سريعًا بأن نص الجسم يحقّق حدًّا أدنى من التباعد المطلق للقراءة الطويلة، حتى عندما يبقى رمز المصدر نسبة. فرق التحرير والطباعة التي ما زالت تحدّد leading بالمعنى التقليدي تحصل على نفس الأرقام كحاصل line-height في CSS عندما تُطبَّق النسبة بالطريقة نفسها. اقرنوا الأداة بمحوّلات وحدات الطباعة عندما تحتاجون أيضًا px إلى em أو rem، وتذكّروا أن العرض الحقيقي ما زال يعتمد على مقاييس الخط ونماذج الصناديق بعد أن تغادر قيمة البكسل هذه الحاسبة.
حالات الاستخدام
توثيق CSS والمكوّنات
وثّقوا أمثلة Storybook أو أدلة الأسلوب بقيم تباعد px دقيقة تطابق النسب بلا وحدة المستخدمة في أوراق أنماط الإنتاج.
الأسئلة الشائعة
كيف يُحسب التباعد؟
مثال: 16 px بنسبة 1.5 يعطي 24 px تباعدًا و8 px إضافيًا و4 px half-leading.
ماذا يحدث إذا كان حجم الخط صفرًا أو سالبًا؟
حجم خط غير موجب لا يعرّف تباعدًا مفيدًا في هذا النموذج.
هل التباعد هو نفسه line-height في CSS؟
تبلّغ هذه الأداة أيضًا عن الإضافي وhalf-leading لحساب التخطيط.
لماذا تُقرَّب النتائج إلى دقة؟
الدقة الافتراضية 10 منازل عشرية؛ يمكنكم ضبط precision من 0 إلى 15.
ما المسافة الإضافية ونصف التباعد؟
المسافة الإضافية هي التباعد ناقص حجم الخط، أي 8 بكسل في مثال 16 بكسل بنسبة 1.5. ونصف التباعد هو نصفها، 4 بكسل، وتوزعه كثير من أنظمة التخطيط فوق الحروف وتحتها.
أدوات ذات صلة
للمطوّرين — الوصول عبر API
كل ما في هذه الصفحة متاح برمجيًا. هذا القسم موجّه للفرق التقنية التي تريد ربط الأداة بأنظمتها الخاصة؛ بقية المستخدمين يمكنهم استخدام الأداة أعلاه مباشرة دون الحاجة لقراءة ما يلي.
الـEndpoint
صادِق على طلبك بترويسة Bearer، وأرسل طلب POST واحدًا لتدخل مهمتك قائمة التنفيذ فورًا؛ ثم تستلم النتيجة عبر webhook أو رابط موقّع.
استدعِ الخدمة من بيئتك
curl -X POST https://api.kit.forhosting.com/str/leading-from-ratio \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"font_size":16,"ratio":1.5}'const res = await fetch("https://api.kit.forhosting.com/str/leading-from-ratio", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"font_size": 16,
"ratio": 1.5
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/str/leading-from-ratio",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"font_size": 16,
"ratio": 1.5
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/str/leading-from-ratio", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"font_size":16,"ratio":1.5}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"font_size":16,"ratio":1.5}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/str/leading-from-ratio", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)مثال على الطلب
{
"font_size": 16,
"ratio": 1.5
}مثال على الاستجابة
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "str.leading_from_ratio",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}الواجهة غير متزامنة: تستلم task_id فور الإرسال، ويمكنك الاستعلام عن الحالة بمعدل طلب واحد في الثانية.
الأسعار
السعر معلن كما تراه: لا tokens ولا نظام نقاط؛ وإن فشلت المهمة فلن تُحاسَب عليها.
الحدود
max_abs_value | 1000000000000000 |
الأخطاء
| HTTP | الرمز | المعنى |
|---|---|---|
401 | unauthorized | مفتاح الوصول مفقود أو غير صالح؛ تحقق من ترويسة Bearer في طلبك. |
402 | insufficient_balance | رصيدك لا يكفي لتنفيذ هذه المهمة؛ أعد شحن الرصيد ثم أعد المحاولة. |
404 | unknown_type | نوع المهمة المطلوب غير موجود في الكتالوج — راجع الاسم المرسل في الطلب. |
429 | rate_limited | تجاوزت الحد المسموح من الطلبات؛ انتظر قليلًا ثم أعد المحاولة. |
ملاحظات تقنية
استخدموا الأداة مجانًا في المتصفح لمقاييس الطباعة وجداول رموز التصميم والفحوص السريعة أثناء كتابة CSS، أو استدعوا API بسعر $0.002 لكل طلب ناجح عندما تحتاجون ثوابت تباعد قابلة لإعادة الإنتاج في CI أو أنظمة التصميم أو عروض التدريس دون إعادة تنفيذ الضرب يدويًا.
معنى التباعد بين الأسطر وما تعيده هذه الحاسبة
تقدّمون حجم خط موجبًا ببكسل CSS ونسبة بلا وحدة موجبة؛ فيعيد المحرك الحجم المُطبَّع والنسبة وleading_px وextra_leading_px وhalf_leading_px ووسم الطريقة leading_from_ratio ودقة التقريب وسلسلة صيغة قصيرة. المدخلات غير الصالحة ترفع invalid_input، بما في ذلك غياب الحجم أو النسبة، والقيم غير المنتهية، والمقادير فوق السقف الموثَّق، وأي حجم أو نسبة غير موجبة، لأن خطًّا صفريًا أو سالبًا لا يعرّف صندوق سطر مفيد. المسار حتمي، فنفس المدخلات تنتج دائمًا نفس الأرقام المقرَّبة لجداول العمل واختبارات الوحدة ومولّدات الرموز ومستهلكي API الذين لا يجوز لهم اختراع التباعد.
كيف يُقرأ حجم الخط والنسبة وكيف تبقى النتائج قابلة لإعادة الإنتاج
يُسمح بإشارات زائد اختيارية وبالترميز العلمي على السلاسل الرقمية عندما تُفسَّر ككسور عشرية منتهية؛ وتُرفض المسافات المضمَّنة والبادئات الست عشرية والرموز غير الرقمية برسالة واضحة كي لا تصبح خلية سيئة تباعدًا خاطئًا. يجب أن تكون النسبة موجبة أيضًا: مضاعف صفر ينهار صندوق السطر، ونسبة سالبة ليست حاصل تباعد صالحًا في هذا النموذج. أسماء الحقول المفضّلة هي font_size للحجم ببكسل CSS وratio للمضاعف بلا وحدة، لكن تُقبل أسماء بديلة مثل fontSize وsize وfs وpx للحجم، وline_height_ratio وlineHeight وmultiplier وlh وleading_ratio للنسبة، حتى تعيد جداول البيانات وسلاسل الاستعلام والنماذج المكتوبة استخدام عقد واحد. أحجام الخط الصفرية أو السالبة تفشل دائمًا بـ invalid_input، وفق قاعدة المنتج بأن حساب التباعد غير معرَّف للخط غير الموجب. حقل precision اختياري بأسماء decimals وdp يختار عدد المنازل العشرية لكل المخرجات الرقمية، افتراضيًا عشرة وبحد أقصى خمسة عشر حتى تبقى ملفات JSON الذهبية مستقرة عبر بيئات التشغيل. اجمعوا التشغيل المجاني في متصفح هذه الصفحة مع API المدفوع عندما تحتاجون النتيجة الرياضية نفسها داخل خط أنابيب آلي أو بناء رموز تصميم دون إعادة تنفيذ الضرب بأنفسكم.
أين يناسب التباعد بالبكسل أنظمة التصميم وCSS والتعليم
يستخدم مهندسو الواجهة الأمامية الحساب نفسه عند توليد خصائص CSS مخصّصة من ملف JSON للرموز، أو توثيق سلّم طباعة في Storybook، أو كتابة اختبارات لقطة تتوقع تباعدًا أربعة وعشرين لجسم بستّة عشر بكسل ونسبة واحد فاصلة خمسة. في هذه الصفحة يعمل كل شيء داخل متصفحكم؛ وعبر API يكلّف كل استعلام ناجح $0.002، ولا تُحسب فشل التحقق، ولا يُخزَّن شيء بعد الاستجابة. هذا التقسيم—استكشاف تفاعلي مجاني وAPI مطابق مدفوع—يوافق بقية كتالوج KIT من المستوى A ويتيح لكم الانتقال من نقد تصميم إلى خط أنابيب رموز آلي دون تغيير النتيجة الرياضية.
حالات التكامل
سلالم طباعة من رموز التصميم
من حجم خط كل درجة ونسبة مشتركة، جسّدوا تباعدًا مطلقًا بالبكسل مع الإضافي وhalf-leading لتسليم Figma وCSS البريد وتصدير JSON للرموز.
ثوابت CI حتمية
ولّدوا نتائج leading_px قابلة لإعادة الإنتاج لاختبارات الوحدة واللقطات ونصوص بناء نظام التصميم دون ضرب يدوي.
أسئلة تقنية
كم تكلفة حاسبة التباعد بين الأسطر؟
مجانية في متصفحكم في هذه الصفحة. عبر API يكلّف الطلب الناجح $0.002؛ والمدخلات غير الصالحة لا تُحسب.