HTML – الطراز/الاطار Style

تستخدم الصفة style لتحديد اطار/طراز style عناصر الويب وتتضمن الالوان والخلفيات و رسم الخط font وغيرها من الصفات. وقد تحتوي ​السمة style على اكثر من خاصية. مثال:

<p style = "color:red;background-color:black;"> اهلا وسهلا </p>

تكون طريقة الكتابة بتسمية الخاصيات ثم : ثم قيمة الخاصية ثم ;
يوجد العديد من الخاصيات التي يمكن استخدمها اهمها:

اللون color

لتغير لون النصوص نستخدم الخاصية color و تكون القيمة احدى الالون المعرفة مسبقا مثل red و blue وغيرها او باستخدام نظام الست عشري (Hex decimal) مثل 39AA2C#. مثال:

<h1 style = "color:red;"> اهلا وسهلا </h1>

<h1 style = "color:#0000FF;"> اهلا وسهلا </h1>

لون الخلفية background-color

لتغير لون خلفية ​عناصر HTML نستخدم الخاصية background-color و تكون القيمة احدى الالون المعرفة مسبقا مثل red و blue وغيرها او باستخدام نظام الست عشري (Hex decimal) مثل 39AA2C#. مثال:

<h1 style = "color:red;background-color:#0000FF;"> اهلا وسهلا </h1>

محاذاة النص text-align

نستيطع تحديد محاذة النص الى اليمين او اليسار او المنتثف باستخدام الخاصية text-align وهي تقبل القيم: right لليمين و center للمنتصف و left لليسار مثال:

<h1 style = "text-align:center"> اهلا وسهلا </h1>
<h1 style = "text-align:right"> اهلا وسهلا </h1>
<h1 style = "text-align:left"> اهلا وسهلا </h1>

حجم الخط font-size

لتغير حجم النصوص في ​عناصر HTML نستخدم الخاصية font-size . مثال:

<p style = "color:#0000FF;font-size:80%"> اهلا وسهلا </p>
    <p style = "color:#0000FF;font-size:200%"> اهلا وسهلا </p>

شكل الخط font-family

لتغير شكل خط النصوص في ​عناصر HTML نستخدم الخاصية font-family . مثال:

<h1 style = "font-family:'Courier New'"> اهلا وسهلا </h1>

<h1 style = "font-family:Arial"> اهلا وسهلا </h1>