إعلان
دورة تطوير التطبيقات باستخدام لغة JavaScript في هذه الدورة ستتعلم لغة جافا سكريبت, استخدام مكتبة React.js, بناء API الموقع بواسطة Node.js, تطوير تطبيق جوال باستخدام React Native, و في نهاية الدورة ستتعلم تطوير تطبيق محادثة شبيه بتطبيق WhatsApp. تعلم الآن
دورة تطوير واجهات المستخدم في هذه الدورة ستتعلم لغة HTML و لغة CSS و لغة JavaScript. من ناحية التطبيق العملي ستتعلم طريقة بناء واجهة متجر إلكتروني مكون من ست صفحات, تحويل خمسة تصاميم PSD إلى صفحات ويب, بناء واجهة مستخدم تشبه موقع يوتيوب, بناء لوحة تحكم إحترافية. تعلم الآن
تطوير تطبيقات باستخدام لغة بايثون في هذه الدورة ستتعلم أساسيات البرمجة بلغة بايثون وصولاً إلى التعامل مع أشهر أطر العمل (Flask و Django) و ستتعلم كيف تبني متجر إلكتروني يمكن للمستخدمين البيع و الشراء من خلاله. تعلم الآن
دورة تطوير تطبيقات الويب باستخدام لغة PHP في هذه الدورة ستتعلم لغة PHP من الصفر, استخدام إطار العمل Laravel بشرح مفصّل و عملي, كيفية تطوير شبكة اجتماعية تشبه Instagram, بناء API لتطبيق جوال وفق أسلوب RESTful, تطوير موقع إعلانات مبوبة, تطوير نظام إدارة محتوى CMS كامل. تعلم الآن
دورة تطوير تطبيقات الويب باستخدام لغة Ruby في هذه الدورة ستتعلم البرمجة بلغة Ruby إنطلاقاً من أبسط المفاهيم وحتى بناء تطبيق حقيقي, إستخدام إطار العمل Ruby on Rails بشرح مفصّل و عملي, بناء تطبيق حقيقي عبارة عن شبكة اجتماعية تشبه تويتر, تطوير مجتمع الكتروني يشبه حسوب I/O. تعلم الآن
دورة علوم الحاسوب هذه الدورة معدة لتكون مدخل لعلوم الحاسوب و لغات البرمجة حيث ستتعرف فيها على أنظمة التشغيل و ستتعمق في نظام لينكس و في كيفية التعامل معه من خلال موجه الأوامر, بالإضافة إلى قواعد البيانات و أساسيات الشبكات و الخوادم و مبادئ الحماية والأمان في الويب. تعلم الآن

    HTML تنسيق النصوص

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

    تنسيق النص ( 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>
    		

    جرب الكود

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

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


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

    مثال

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

    جرب الكود

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

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

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

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

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


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

    مثال

    <p>10<sup>6</sup> log<sub>2</sub> 64 = 6 Mbps</p>
    		

    جرب الكود

    إعلان

    Eqla3Tech.com

    شروحات مكتوبة حول لغات البرمجة و تقنية المعلومات باللغة العربية مقدمة من إقلاع تك.

    لغة جافا لغة ++C قواعد البيانات نظام ويندوز نظام لينكس الشبكات تقنية المعلومات الأمن السيبراني

    الدورات

    أدوات مساعدة

    الأقسام

    دورات
    مقالات أسئلة مشاريع كتب