002-01141087755 info@CodesRoots.com
تصميم مواقع وتطبيقات الموبايل والجوال-HTML-Formatting


HTML-Formatting

إذا كنت تستخدم معالج النصوص،
 يجب أن تكون على دراية مع القدرة على جعل النص عريض،
مائل، أو شدد. هذه ليست سوى ثلاثة من الخيارات
المتاحة عشر للإشارة إلى كيفية ظهور النص في HTML و XHTML.

-Bold Text-
 

يتم عرض أي شيء الذي يظهر في <b> ... </ B> عنصر،
 بالخط العريض كما هو مبين أدناه:

 

مثال

 

<!DOCTYPE html>
<html>
<head>
<title>Bold Text Example</title>
</head>
<body>
<p>The following word uses a <b>bold</b> typeface.</p>
</body>
</html>

-Italic Text-

أي شيء الذي يظهر في <I> ... </ I> يتم عرض عنصر في المائل كما هو مبين أدناه:

 

مثال

 

<!DOCTYPE html>
<html>
<head>
<title>Italic Text Example</title>
</head>
<body>
<p>The following word uses a <i>italicized</i> typeface.</p>
</body>
</html>

-Underlined Text-
يتم عرض أي شيء الذي يظهر في <U> ... </ U> عنصر، مع تسطير كما هو مبين أدناه:

مثال

<!DOCTYPE html>
<html>
<head>
<title>Underlined Text Example</title>
</head>
<body>
<p>The following word uses a <u>underlined</u> typeface.</p>
</body>
</html>

-Strike Text-

أي شيء الذي يظهر في < strike> ... </ strike>
 يتم عرض عنصر مع يتوسطه، وهو خط رفيع من خلال النص كما هو مبين أدناه:

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Strike Text Example</title>
</head>
<body>
<p>The following word uses a <strike>strikethrough</strike> typeface.</p>
</body>
</html>

-Monospaced Font-

هو مكتوب مضمون <TT> ... </ TT> عنصر في خط أحادي المسافة.
معظم الخطوط التي تعرف باسم الخطوط متغيرة العرض
 لأن أحرف مختلفة هي من العروض المختلفة
 (على سبيل المثال، الحرف "m" هو أوسع من الرسالة 'I').
 في خط أحادي المسافة، ومع ذلك، كل حرف لديه نفس العرض.

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Monospaced Font Example</title>
</head>
<body>
<p>The following word uses a <tt>monospaced</tt> typeface.</p>
</body>
</html>

-Superscript Text-

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

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Superscript Text Example</title>
</head>
<body>
<p>The following word uses a <sup>superscript</sup> typeface.</p>
</body>
</html>

-Subscript Text-

محتوى < sub> ... </ sub> هو مكتوب عنصر في منخفض.
حجم الخط المستخدم هو نفس الشخصيات المحيطة به،
 ولكن يتم عرض نصف الارتفاع والحرف تحت الشخصيات الأخرى.

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Subscript Text Example</title>
</head>
<body>
<p>The following word uses a <sub>subscript</sub> typeface.</p>
</body>
</html>

-Inserted Text-

يتم عرض أي شيء الذي يظهر في < INS > ... </ INS> العنصر كنص المدرجة.

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Inserted Text Example</title>
</head>
<body>
<p>I want to drink <del>cola</del> <ins>wine</ins></p>
</body>
</html>

-Deleted Text-


أي شيء الذي يظهر في < del> ... </ del> العنصر، يتم عرض كنص محذوف.

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Deleted Text Example</title>
</head>
<body>
<p>I want to drink <del>cola</del> <ins>wine</ins></p>
</body>
</html>

-Larger Text-


مضمون <BIG> ... </ BIG>
 يتم عرض عنصر حجم خط واحد أكبر من بقية النص المحيط كما هو موضح أدناه:

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Larger Text Example</title>
</head>
<body>
<p>The following word uses a <big>big</big> typeface.</p>
</body>
</html>

-Smaller Text-

مضمون <small> ... </ small>
 يتم عرض عنصر حجم خط واحد أصغر من بقية النص المحيط كما هو موضح أدناه:

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Smaller Text Example</title>
</head>
<body>
<p>The following word uses a <small>small</small> typeface.</p>
</body>
</html>

-Grouping Content-

و<div> و <SPAN> عناصر تسمح لك لمجموعة معا عدة عناصر لإنشاء أقسام أو الأقسام صفحة.

 

على سبيل المثال،
 قد ترغب في وضع كل من الحواشي على صفحة داخل عنصر <div>
 للإشارة إلى أن جميع العناصر داخل تلك <div> العنصر the footnotes.
 فإنك قد إرفاق أسلوب لهذا العنصر <div>
 بحيث تظهر باستخدام مجموعة خاصة من القواعد الاسلوب.

 

مثال
 

<!DOCTYPE html>
<html>
<head>
<title>Div Tag Example</title>
</head>
<body>
<div id="menu" align="middle" >
<a href="/index.htm">HOME</a> | 
<a href="/about/contact_us.htm">CONTACT</a> | 
<a href="/about/index.htm">ABOUT</a>
</div>

<div id="content" align="left" bgcolor="white">
<h5>Content Articles</h5>
<p>Actual content goes here.....</p>
</div>
</body>
</html>

مجموعة <span> عنصر،
من ناحية أخرى، يمكن استخدامها لعناصر مجموعة مضمنة فقط.
 لذلك، إذا كان لديك جزء من الجملة أو الفقرة التي تريد تجميع معا،
 يمكنك استخدام <SPAN> العنصر كما يلي

مثال 
 

<!DOCTYPE html>
<html>
<head>
<title>Span Tag Example</title>
</head>
<body>
<p>This is the example of <span style="color:green">
span tag</span> and the <span style="color:red">
div tag</span> alongwith CSS</p>
</body>
</html>

هذا هو سبيل المثال من العمر العلامة والعلامة شعبة جنبا إلى جنب مع CSS

وتستخدم هذه العلامات عادة مع CSS للسماح لك بإرفاق أسلوب لجزء من الصفحة.



اعلانات
شركة تصميم مواقع وتطبيقات موبايل اتصل بنا
شركة تصميم مواقع وتطبيقات موبايل اتصل بنا

00966-506999922

متاح واتس اب - فايبر - لاين
شركة تصميم مواقع وتطبيقات موبايل

info@CodesRoots.com