HTML Text Formatting
تنسيق النصوص بلغة HTML
سوف تتعلم في هذا الدرس العناصر الخاصة بتنسيق المحتوى النصي في لغة HTML، مثل: الألوان، وميل الخطوط، وأنواع الخطوط، وحجم الخط، والخطوط الهامة.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
HTML Text Formatting
تنسيق النصوص في لغة HTML
</>
HTML Bold Element
عنصر Bold في لغة HTML
- يستخدم عنصر <b> لتغيير أو تحويل النصوص من نصوص بخط عادي إلى نصوص بخط عريض في لغة HTML، وعنصر <b> هو اختصار لكلمة bold.
- عنصر <b> هو من نوع العناصر المُتداخلة [nested elements]، له علامة الفتح [open tag] وعلامة الإغلاق [close tag].
Using HTML To Bold Text In A Paragraph
هذا المثال يوضح كيفية تمييز جزء من النص بجعله عريضًا باستخدام وسم `<b>` في HTML.
Make Text Bold In HTML Example
مثال يعرض كيفية استخدام وسم `<b>` لجعل النص داخل فقرة HTML يظهر بشكل غامق.
<!DOCTYPE html> <html> <head> </head> <body> <h1> Make text bold </h1> <p> closetag is a platform to teach you <b>programing </b> language </p> </body> </html>
</>
HTML Strong Element
عنصر Strong في لغة HTML
- يستخدم عنصر <strong> لتغيير الخط من خط عادي إلى خط هام، وهو هام أيضًا لمحركات البحث، ويجعل الخط عريض مثل bold.
- عنصر <strong> من نوع العناصر المُتداخلة [nested elements]، له علامة الفتح [open tag] وعلامة الإغلاق [close tag].
Make Text Strong In HTML
يوضح المثال كيفية إبراز النص المهم باستبدال العنصر `<strong>` في HTML.
Emphasize Text With HTML
المثال يعرض صفحة HTML بسيطة تُبرز كلمة [programing] باستخدام عنصر `<strong>`.
<!DOCTYPE html> <html> <head> </head> <body> <h1> Make text strong </h1> <p> closetag is a platform to teach you <strong> programing </strong> language </p> </body> </html>
هام
</>
HTML Italic Element
عنصر Italic في لغة HTML
- يستخدم عنصر <i> لتغيير الخط من خط عادي إلى خط مائل، ويشير إلى كلمة italic.
- عنصر <i> من نوع العناصر المُتداخلة [nested elements]، له علامة الفتح [open tag] وعلامة الإغلاق [close tag].
Using HTML To Italicize Text In A Baragraph
هذا المثال يوضح كيفية جعل جزء من النص مائلاً باستخدام علامة `<HTML `<i.
HTML Example: Using Italic Text
المثال يعرض صفحة ويب بسيطة تحتوي على عنوان وفقره مع نص مائل لتوضيح كيفية استخدام علامة `<i>` لجعل النص مائلاً داخل مستند HTML.
<!DOCTYPE html> <html> <head> </head> <body> <h1> Make text italic </h1> <p> closetag is a platform to teach you <i> programing </i> language <p> </body> </html>
ملاحظة
يُستخدم العنصر <i> في لغة HTML بغرض العرض ولا يضيف أي معنى دلالي إلى المحتوى.
</>
HTML Em Element
عنصر Em في لغة HTML
- [HTML [<em> element اختصار لـ emphasized، يستخدم عنصر <em> في إمالة النص، ويتشابه مع العنصر < i > من حيث طريقة العرض.
- عنصر <em> من العناصر المُتداخلة [nested elements]، له علامة الفتح [open tag] وعلامة الإغلاق [close tag].
HTML Example For Emphasizing Text
هذا المثال يوضح كيفية استخدام علامة HTML لجعل النص مائلًا باستخدام العلامة `<em>`.
Using HTML To Emphasize Text In A Paragraph
المثال يوضح استخدام HTML لعرض نص عادي وآخر مائل، حيث يتم إبراز النص باستخدام وسم `<em>`.
<!DOCTYPE html> <html> <body> <p>This text is normal.</p> <p><em>This text is emphasized.</em></p> </body> </html>
معلومة تهمك
نستخدم HTML <em> element عادةً في نقل الضغط stress أو الأهمية للقارئ، مثل الطريقة التي قد يستخدم بها المرء التركيز في اللغة المنطوقة من خلال رفع صوته أو تغيير نغمته في كلمات معينة.
</>
HTML Small Element
عنصر Small في لغة HTML
Formatting Normal And Small Text With HTML Tags
عرض نص عادي ونص بحجم أصغر باستخدام عناصر HTML.
Using HTML Tags To Format Normal And Small Text
صفحة ويب بسيطة توضح كيفية عرض نص عادي وآخر بحجم أصغر باستخدام علامات HTML.
<!DOCTYPE html> <html> <head> <meta charset = "UTF-8"> </head> <body> <p>نص عادي .</p> <small>نص صغير </small> </body> </html>
توضيح
</>
HTML Mark Element
عنصر Mark في لغة HTML
يستخدم HTML <mark> element لتلوين النصوص بعلامة صفراء وبارزة أو لتسليط الضوء على هذا النص.
`<Highlighting Text Using the `<mark
المثال يوضح كيفية استخدام عنصر `<mark>` في HTML لتسليط الضوء على كلمة [milk].
Highlighting Text With The HTML `<mark>` Element
المثال يوضح كيفية استخدام عنصر `<mark>` في HTML لتسليط الضوء على كلمة [milk].
<!DOCTYPE html> <html> <body> <p>Do not forget to buy <mark>milk</mark> today.</p> </body> </html>
توضيح
</>
HTML Del Element
عنصر Del في لغة HTML
يستخدم HTML <del> element لعمل علامة حذف أو شطب فوق النص، أو لجعل النص ملغي من صفحة الويب أو من هذه الجملة، كما يحدد المتصفح هذا النص بعلامة عرضية على النص.
Using HTML `<del>` Tag To Indicate Deleted Text
المثال يوضح كيفية استخدام عنصر `<del>` لتمييز نص محذوف، حيث يظهر أن اللون المفضل كان أزرق وتم استبداله بالأحمر.
Using the `<del>` tag in HTML to indicate a change in color preferences
المثال يستخدم وسم `<del>` لشطب كلمة "blue" ليظهر أن اللون المفضل تغير من الأزرق إلى الأحمر.
<!DOCTYPE html> <html> <body> <p>My favorite color is <del>blue</del> red.</p> </body> </html>
</>
HTML Ins Element
عنصر Ins في لغة HTML
يستخدم HTML <ins> element لجعل النص مدرج في الجملة أو متباعد عن السطر، كما يقوم المتصفح بجعله أسفل الجملة، ويقوم بوضع خط أسفل المحتوى الموجود بداخله.
Using HTML To Indicate Edited Text
المثال يوضح استخدام علامات HTML لإظهار أن اللون المفضل تم تغييره من الأزرق إلى الأحمر.
Using HTML To Indicate Edited Text
المثال يوضح استخدام علامات HTML لإظهار أن اللون المفضل تم تغييره من الأزرق إلى الأحمر.
<!DOCTYPE html> <html> <body> <p>My favorite color is <del>blue</del> <ins>red</ins>.</p> </body> </html>
</>
HTML Sub Element
عنصر Sub في لغة HTML
- عنصر HTML <sub> element اختصارًا لـ Subscript.
- يستخدم HTML <sub> element من أجل عمل نصوص منخفضة بمقدار نصف حرف أسفل السطر الطبيعي، كما يعرض النص المنخفض بخط أصغر من الطبيعي، وعادةً ما يستخدم في الرموز الكيمائية، مثل: رموز المكونات الكيمائية H2.
Using HTML To Create Subscript Text
هذا المثال يوضح كيفية استخدام HTML لإنشاء نص في صيغة النص السفلي باستخدام العلامة `<sub>`.
Using HTML To Create Subscript Text
هذا المثال يوضح كيفية استخدام HTML لإنشاء نص في صيغة النص السفلي باستخدام العلامة `<sub>`.
<!DOCTYPE html> <html> <body> <p>This is <sub>subscripted</sub> text.</p> </body> </html>
</>
HTML Sup Element
عنصر Sup في لغة HTML
يستخدم HTML <sup> element من أجل عمل نصوص مرتفعة بمقدار نصف حرف أعلى السطر الطبيعي، كما يعرض النص المرفوع بخط أصغر من الطبيعي، وعادةً ما يستخدم في العمليات الحسابية.
Using HTML To Create Superscripted Text
هذا المثال يوضح كيفية استخدام HTML لإنشاء نص بصيغة النص العلوي باستخدام العلامة `<sup>`.
Using HTML To Create Superscripted Text
هذا المثال يوضح كيفية استخدام HTML لإنشاء نص بصيغة النص العلوي باستخدام العلامة `<sup>`.
<!DOCTYPE html> <html> <body> <p>This is <sup>superscripted</sup> text.</p> </body> </html>
</>
HTML Larger Text
عنصر Big في لغة HTML
إذا كنت تريد جعل حجم الخط أكبر من باقي النص، فضع المحتوى داخل عنصر <big>.........</big>، ليزيد من حجم الخط.
`<Using HTML To Enlarge Text With `<big
هذا المثال يوضح كيفية استخدام HTML لعرض نص عادي ونص بحجم أكبر باستخدام العلامة `<big>`.
`<Using HTML To Enlarge Text With `<big
هذا المثال يوضح كيفية استخدام HTML لعرض نص عادي ونص بحجم أكبر باستخدام العلامة `<big>`.
<p>Plain text</p> <big> big text </big>
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم هندسة البرمجيات. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال هندسة البرمجيات. مهمتنا ليست فقط تعليم هندسة البرمجيات، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
الدورات
لا يوجد
