شرح اداة SOLMAP واستغلالINJ ECTION

  ما مفهوم تنسيق النص في  HTML

مفهوم تنسيق النص

تعليم أجزاء في النص

تعليم النص ( Text Marking ) فكرته وضع لون أصفر خلف جزئية محددة في النص للفت نظر المستخدم إليها.
أي كلمة أو جملة في النص تريد تعليمها باللون الأصفر يمكنك وضعها بين <mark> </mark>.

في المثال التالي قمنا بتعليم كلمة موجودة في الفقرة باستخدام <mark>.

مثال

• <p><mark>Fast food</mark> affect your body!</p>

عرض جزء من النص بشكل مرتفع أو منخفض

في المعادلات الحسابية نتعامل كثيراً مع أرقام و رموز تظهر بشكل مرتفع قليلاً أو منخفض قليلاً نسبةً لباقي الأرقام و الرموز الموجودة في نفس السطر.

في HTML يوجد نوعين من الوسوم التي تستخدم لهذا الغرض:

• أي جزء في النص تريد عرضه بشكل مرتفع قليلاً عن باقي النص ضعه بين .

• أي جزء في النص تريد عرضه بشكل منخفض قليلاً عن باقي النص ضعه بين .

معلومة: sup إختصار لكلمة Super Script التي تعني نص مرتفع, و sub إختصار لكلمة Sub Script التي تعني نص منخفض.

في المثال التالي قمنا بعرض جزء من النص بداخل  حتى يظهر بشكل مرتفع قليلاً عنه و جزء من النص بداخل  حتى يظهر بشكل منخفض قليلاً عنه.

تنسيق النص ( Text Formatting ) يقصد به عرض النص بشكل أفضل فمثلاً إن كان هناك كلمة مهمة في النص يمكننا عرضها بخط عريض, و إن كان هناك شيء تم حذفه يمكننا عرضه خط فوقه للإشارة إلى أنه محذوف و هكذا.

في HTML يوجد العديد من الوسوم الجاهزة التي يمكن استخدامها في تنسيق النص و هي ما سنتعرف عليها في هذا الدرس.

عرض النص بخط عريض

أي كلمة أو جملة في النص تريد عرضها بخط عريض ( Bold ) يمكنك وضعها بين <b> </b> أو بين <strong> </strong>.
بشكل عام إستخدم <b> إذا أردت عرض الكلام بخط عريض و استخدم <strong> في حال كان الكلام مهم.

في المثال التالي قمنا بعرض كلمة في الفقرة بخط عريض باستخدام <b> و <strong> أيضاً.

مثال

• <p>My name is <b>Mhamad</b></p>
• <p>My name is <strong>Mhamad</strong></p>

عرض النص بخط مائل

أي كلمة أو جملة في النص تريد عرضها بخط مائل ( Italic ) يمكنك وضعها بين <i> </i> أو بين <em> </em>.

الفرق الوحيد بين الإثنين هو أنه في حال كان المستخدم كفيف و يعتمد على قارئ الشاشة ( Screen Reader ) حتى يقرأ له محتوى الصفحة, فإن القارئ سيغير نبرته حين يقرأ النص المائل الموضوع بداخل <em> </em> لا أكثر.
لذلك استخدم <i> إذا أردت عرض نص مائل و استخدم <em> في حال أردت عرض نص مائل و أردت جعل قارئ الشاشة يغيّر نبرته حين يقرأ الكلام المائل.

في المثال التالي قمنا بعرض جملة في الفقرة بخط مائل باستخدام <i> و <em> أيضاً.

مثال

• <p><i>Lord of the Rings</i> is a very large book.</p>
• <p><em>Lord of the Rings</em> is a very large book.</p>

عرض نص محذوف

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

في المثال التالي قمنا بعرض كلام مشطوب في الفقرة باستخدام <del> و <s> أيضاً.

مثال

• <p>HTML is so <del>hard</del> easy to learn.</p>
• <p>The Earth is <s>flat</s> spherical in shape.</p>

وضع خط تحت النص

أي كلمة أو جملة في النص تريد عرض خط تحتها ( Underline ) يمكنك وضعها بين <u> </u> أو بين <ins> </ins>.
بشكل عام إستخدم <u> إذا أردت وضع خط تحت الكلام و استخدم <ins> في حال كان سبب وضع الخط هو الإشارة إلى أن النص تم إضافته على النص الموجود مسبقاً.

في المثال التالي قمنا بعرض خط تحت الكلام الموجود في الفقرة باستخدام <u>.

المثال الأول

• <p><u>Name:</u> Mhamad Harmush</p>

في المثال التالي قمنا بعرض كلام محذوف باستخدام <del> يليه كلام تحته خط باستخدام <ins> للإشارة إلى أنه تم تبديل الكلام المحذوف بالكلام الذي تحته خط.

المثال الثاني

• <p>HTML is <del>not important</del> <ins>essential</ins> in web design.</p>

 ان شاء الله تكون قد تعلمت اهم العناوين في لغة البرمجة HTML واراك في الدرس التالي