تنسيق النص HTML و CSS | دروس HTML5

 تغيير مظهر فقرات HTML

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


تأمل المثال التالي: 

<p>I am normal</p>
<p style="color:red;">I am red</p>
<p style="color:blue;">I am blue</p>
<p style="font-size:36px;">I am big</p>

في المثال أعلاه ، هناك ثلاث فقرات ، تم تعيين كل منها على قيمة سمة النمط.  


سمة النمط في HTML

في مثال التعليمات البرمجية التالي ، يمكنك معرفة كيفية تعيين سمة النمط لعناصر HTML:

<tagname style="property:value;">

الخاصية هي سمة CSS والقيمة هي قيمة CSS.
في بقية هذا المنشور ، سأشرح سمات وقيم CSS التي يمكننا استخدامها في سمة النمط.


لون الخلفية في HTML

تحدد سمة لون الخلفية لون الخلفية لعناصر HTML.

في المثال أدناه ، تم ضبط لون خلفية الصفحة على مسحوق أزرق.

<body style="background-color:powderblue;">

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>

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

تحدد سمة اللون لون النص لعنصر HTML. 

<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>

الخطوط في HTML

تحدد سمة عائلة الخط الخط المستخدم لعنصر HTML:

<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>

حجم النص في HTML

تحدد سمة حجم الخط حجم النص لعناصر HTML.

<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>

محاذاة النص في HTML

تحدد سمة محاذاة النص محاذاة النص لعناصر HTML.

<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>


كلمات مفتاحية: