0Pricing
HTML for Kids · درس

تنسيق النصوص

اجعل النص عريضًا أو مائلًا أو مسطرًا

تنسيق النصوص درس مجاني في HTML for Kids على CoddyKit. هذا هو الدرس 4 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في HTML for Kids، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة HTML for Kids 4 دروس في المجموع.

تنسيق النصوص

مرحبًا بكم في الدرس التالي! سنتعلّم اليوم كيفية تنسيق النصوص في HTML لجعلها عريضة أو مائلة أو مسطّرة وغير ذلك الكثير. لنبدأ!

تنسيق النصوص — رسم توضيحي 1

لماذا ننسّق النصوص؟

يساعدكم تنسيق النصوص على:

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

لنستكشف الطرق المختلفة لتنسيق النصوص في HTML!

جعل النص عريضًا

استخدموا وسم <strong> أو <b> لجعل النص عريضًا. يعمل كلاهما بطريقة متشابهة، لكن <strong> يُستخدم للنص المهم.

مثال:

<p>This is <strong>important</strong> text.</p>
<p>This is <b>bold</b> text.</p>

جعل النص مائلًا

استخدموا وسم <em> أو <i> لجعل النص مائلًا. يضيف <em> تأكيدًا، بينما يُستخدم <i> للتنسيق فحسب.

مثال:

<p>This is <em>emphasized</em> text.</p>
<p>This is <i>italicized</i> text.</p>

تسطير النص

استخدموا وسم <u> لتسطير النص.

مثال:

<p>This is <u>underlined</u> text.</p>

شطب النص

استخدموا وسم <del> أو <s> لإظهار النص مشطوبًا. ويفيد ذلك في وضع علامة على النص المحذوف أو غير الصحيح.

مثال:

<p>This is <del>deleted</del> text.</p>
<p>This is <s>strikethrough</s> text.</p>

دمج التنسيقات

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

مثال:

<p>This is <strong><em>bold and italicized</em></strong> text.</p>
<p>This is <u><i>underlined and italicized</i></u> text.</p>

جرّب بنفسك

لننشئ صفحة ويب تحتوي على نص منسّق. إليكم مثالًا:

<!DOCTYPE html>
<html>
  <head>
    <title>Text Formatting</title>
  </head>
  <body>
    <h1>Text Formatting Example</h1>
    <p>This is <strong>bold</strong> text.</p>
    <p>This is <em>italicized</em> text.</p>
    <p>This is <u>underlined</u> text.</p>
    <p>This is <strong><em>bold and italicized</em></strong> text.</p>
  </body>
</html>

أحسنتم!

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

تنسيق النصوص — رسم توضيحي 10

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

هل درس «تنسيق النصوص» مجاني؟

نعم — نص درس «تنسيق النصوص» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة HTML for Kids، انتقل إلى CoddyKit PRO. تتضمن دورة HTML for Kids 4 دروس في المجموع.

ماذا ستتعلم في «تنسيق النصوص»؟

اجعل النص عريضًا أو مائلًا أو مسطرًا تتمرن على HTML for Kids مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ HTML for Kids؟

لا تُشترط خبرة سابقة. HTML for Kids على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 4 من أصل 4.

كم من الوقت يستغرق درس «تنسيق النصوص»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس HTML for Kids هذا؟

نعم. كل درس في HTML for Kids يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. الأنماط المضمّنة
  2. أساسيات CSS
  3. الألوان والخلفيات
  4. تنسيق النصوص
← العودة إلى HTML for Kids