ForHosting KIT · المنزل والطبخ والهوايات

حاسبة ارتفاع السطر

يحتاج نص بحجم 16 px مع نسبة 1.5 إلى ارتفاع سطر قدره 24 px. أدخل أي حجم خط ونسبة لتحصل على القيمة بالبكسل لتخطيط ثابت أو مواصفات تصميم أو قالب بريد إلكتروني. مجانًا في متصفحك.

مجاني
يعمل في متصفحك
دون تسجيل
بياناتك لا تغادر جهازك

شغّل الأداة مجانًا اطّلع على الـAPI

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

مثال محلول

إذا أدخلت

حجم الخط: 16
نسبة ارتفاع السطر عديمة الوحدة: 1.5

تحصل على

ارتفاع السطر بالبكسل: 24
الدقة: 10

تحوّل حاسبة ارتفاع السطر هذه حجم خط بوحدة بكسل CSS ونسبة ارتفاع سطر عديمة الوحدة إلى ارتفاع السطر الناتج بالبكسل، وهي القيمة الدقيقة التي تضبطها في line-height عندما تفضّل قيمة بكسل مطلقة بدل مضاعِف عديم الوحدة. لا يزال المصممون ومطورو الواجهة الأمامية يلجؤون إلى هذا الحساب باستمرار: نص أساسي بحجم ستة عشر بكسل بنسبة واحد فاصلة خمسة يحتاج إلى ارتفاع سطر أربعة وعشرين بكسل؛ وعناوين بحجم ثمانية عشر بكسل بنسبة واحد فاصلة ستة تحتاج إلى ثمانية وعشرين فاصلة ثمانية بكسل. المتطابقة حتمية بالكامل: ارتفاع السطر بالبكسل يساوي حجم الخط مضروبًا في النسبة. لا يوجد اتصال بالشبكة، ولا أخذ عينات، ولا اختصار مرتبط بالتاريخ — بل حساب محدود فقط لعددين موجبين.

ما معنى ارتفاع السطر وماذا تُعيد هذه الحاسبة

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

تُنفّذ هذه الحاسبة الناتج البسيط: ارتفاع السطر بالبكسل يساوي حجم الخط مضروبًا في النسبة، وهو بالضبط ما تضربه نسبة ارتفاع السطر عديمة الوحدة في حجم الخط المستخدَم. لا يوجد نموذج لتباعد الأسطر في الطباعة المعدنية التقليدية، ولا بحث في مقاييس OpenType، ولا تحويل بين rem وem: تلك مسائل منفصلة. وتُرفض النسب غير الموجبة كذلك حتى تبقى النتيجة طول بكسل موجبًا.

أين يُستخدم ارتفاع السطر بالبكسل في أنظمة التصميم وCSS والتعليم

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

ويحتاج مراجعو إمكانية الوصول أحيانًا إلى فحص سريع لتحقّق النص الأساسي من حد أدنى مطلق لارتفاع السطر عند القراءة الطويلة، حتى عندما يكون الرمز المصدري لا يزال نسبة. اجمعها مع محوّلات وحدات الطباعة عندما تحتاج أيضًا إلى تحويل px إلى em، وتذكّر أن العرض الفعلي لا يزال يعتمد على مقاييس الخط ونصف التباعد ونماذج الصندوق بعد أن تغادر قيمة البكسل هذه الحاسبة.

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

توثيق CSS والمكونات

وثّق أمثلة Storybook أو دليل الأسلوب بقيم ارتفاع سطر دقيقة بالبكسل تطابق النسب عديمة الوحدة المستخدَمة في أوراق الأنماط الفعلية.

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

كيف يُحسب ارتفاع السطر؟

على سبيل المثال، 16 بكسل بنسبة 1.5 يعطي 24 بكسل.

ماذا يحدث إذا كان حجم الخط صفرًا أو سالبًا؟

فحجم الخط غير الموجب لا يمكن أن يحدد ارتفاع سطر مفيدًا في هذا النموذج.

هل تحوّل هذه الأداة وحدات rem أو em؟

لا. يُفسَّر حجم الخط كبكسلات CSS والنسبة عديمة الوحدة. استخدم محوّل وحدات مخصصًا إن احتجت إلى rem أو em.

لماذا تُقرَّب النتائج إلى دقة معينة؟

الدقة الافتراضية عشر خانات عشرية؛ ويمكنك ضبط الدقة من 0 إلى 15.

ما ارتفاع السطر المناسب لنص بحجم 16 px؟

مع نسبة 1.5 يكون 24 px. اضرب حجم الخط في النسبة لتحصل على القيمة بالبكسل التي تكتبها في تخطيط ثابت أو تصميم أولي أو قالب بريد إلكتروني.

أدوات ذات صلة

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

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

الـEndpoint

POSThttps://api.kit.forhosting.com/hobby/line-height

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

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

curl -X POST https://api.kit.forhosting.com/hobby/line-height \
  -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/hobby/line-height", {
  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/hobby/line-height",
    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/hobby/line-height", 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/hobby/line-height", 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": "hobby.line_height",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

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

الأسعار

لكل طلب$0.002

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

الحدود

max_abs_value 1000000000000000

الأخطاء

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

ملاحظات تقنية

استخدم الأداة مجانًا في المتصفح لمقاييس الخطوط وأوراق رموز التصميم والفحوص السريعة أثناء كتابة CSS، أو استدعِ واجهة برمجة التطبيقات (API) بتكلفة $0.002 لكل طلب ناجح عندما تحتاج إلى قيم ارتفاع سطر قابلة لإعادة الإنتاج في التكامل المستمر أو أنظمة التصميم أو العروض التعليمية دون إعادة برمجة عملية الضرب يدويًا.

ما معنى ارتفاع السطر وماذا تُعيد هذه الحاسبة

تُدخل حجم خط موجبًا بوحدة بكسل CSS ونسبة عديمة الوحدة موجبة؛ ويُعيد المحرك حجم الخط المطبَّع، والنسبة، وارتفاع السطر المحسوب بالبكسل، ووسم الطريقة line_height، والدقة المستخدمة في التقريب، وسلسلة تذكير موجزة بالصيغة. تُثير المدخلات غير الصالحة الرمز invalid_input، بما في ذلك غياب حجم الخط أو النسبة، والقيم غير المنتهية، والقيم الأكبر من السقف الموثّق، وأي حجم خط غير موجب، لأن حجم الخط الصفري أو السالب لا يمكن أن يحدد صندوق سطر مفيدًا. المسار حتمي، فتُنتج المدخلات نفسها دائمًا الأرقام المقرَّبة نفسها لأوراق العمل واختبارات الوحدات ومولّدات رموز التصميم ومستهلكي واجهة برمجة التطبيقات (API) الذين يجب ألا يبتكروا تباعدًا من عندهم.

كيف تُقرأ قيمتا حجم الخط والنسبة وكيف تبقى النتائج قابلة لإعادة الإنتاج

تُقبل إشارة الجمع البادئة الاختيارية والصيغة العلمية في السلاسل الرقمية عندما تُحلَّل كأعداد عشرية منتهية؛ أما المسافات الداخلية وبادئات الست عشري والرموز غير الرقمية فتُرفض برسالة واضحة حتى لا تتحول خلية خاطئة إلى ارتفاع سطر خاطئ. ويجب أن تكون النسبة موجبة أيضًا: فمضاعِف الصفر سيُسقط صندوق السطر، والنسبة السالبة ليست ناتج ارتفاع سطر CSS صالحًا في هذا النموذج. أسماء الحقول المفضَّلة هي font_size للحجم بوحدة بكسل CSS وratio للمضاعِف عديم الوحدة، لكن الأسماء البديلة مثل fontSize وsize وfs وpx للحجم، وline_height_ratio وlineHeight وmultiplier وlh للنسبة مقبولة أيضًا، بحيث يمكن لجداول البيانات وسلاسل الاستعلام والنماذج المكتوبة إعادة استخدام عقد واحد. حجم الخط الصفري أو السالب يفشل دائمًا برمز invalid_input، بما يوافق قاعدة المنتج القاضية بأن حساب ارتفاع السطر غير معرَّف لحجم خط غير موجب. الحقل الاختياري precision، بأسماء بديلة هي decimals وdp، يحدد عدد الخانات العشرية المعروضة لكل المخرجات الرقمية، وقيمته الافتراضية عشرة وحده الأقصى خمسة عشر حتى تبقى ملفات JSON المرجعية ثابتة عبر بيئات التشغيل. اجمع بين التشغيل المجاني في المتصفح على هذه الصفحة وواجهة برمجة التطبيقات (API) المدفوعة عندما تحتاج إلى النتيجة الرياضية ذاتها داخل خط أنابيب آلي أو بناء رموز تصميم دون إعادة برمجة عملية الضرب بنفسك.

أين يُستخدم ارتفاع السطر بالبكسل في أنظمة التصميم وCSS والتعليم

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

حالات التكامل

مقاييس الخطوط في رموز التصميم

من حجم خط كل درجة ونسبة مشتركة، جسّد بكسلات ارتفاع سطر مطلقة لتسليم Figma، وCSS البريد الإلكتروني، وتصدير رموز JSON.

ثوابت تكامل مستمر حتمية

ولّد نتائج line_height_px قابلة لإعادة الإنتاج لاختبارات الوحدات واختبارات اللقطة ونصوص بناء أنظمة التصميم دون عمليات ضرب يدوية.

أسئلة تقنية

كم تكلّف حاسبة ارتفاع السطر؟

هي مجانية في متصفحك على هذه الصفحة. وعبر واجهة برمجة التطبيقات (API) يكلّف الطلب الناجح $0.002؛ ولا تُفرض رسوم على المدخلات غير الصالحة.

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

شغّل الأداة مجانًا

مثال محلول

ما معنى ارتفاع السطر وماذا تُعيد هذه الحاسبة

أين يُستخدم ارتفاع السطر بالبكسل في أنظمة التصميم وCSS والتعليم

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

توثيق CSS والمكونات

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

أدوات ذات صلة

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

الـEndpoint

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

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

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

الأسعار

الحدود

الأخطاء

ملاحظات تقنية

ما معنى ارتفاع السطر وماذا تُعيد هذه الحاسبة

كيف تُقرأ قيمتا حجم الخط والنسبة وكيف تبقى النتائج قابلة لإعادة الإنتاج

أين يُستخدم ارتفاع السطر بالبكسل في أنظمة التصميم وCSS والتعليم

حالات التكامل

مقاييس الخطوط في رموز التصميم

ثوابت تكامل مستمر حتمية

أسئلة تقنية

شكرًا