آموزش HTML – فصل سوم: استایل ها (Styles)

استایل یک خاصیت (ویژگی، Attribute) در تگ های HTML است که در زیبایی نمایش تاثیر بسیاری دارد. در فصل سوم از آموزش اچ تی ام ال گام به گام، خاصیت Style را به طور کامل معرفی و بسیاری از مقادر ممکن برای استفاده در این خاصیت را در قالب مثال بیان خواهیم کرد. در خاصیت Style اچ تی ام ال در واقع می توان از مقادیر CSS استفاده کرد که در آینده به طور کامل به توضیح آن خواهیم پرداخت.

آموزش HTML – فصل سوم: استایل ها (Styles)

مثال استفاده از استایل ها:

  • این متن آبی است.
  • این متن قرمز است.
  • این متن ایتالیک است.
  • این متن بولد شده است.

خاصیت Style اچ تی ام ال

تعیین استایل یک المان اچ تی ام ال با خاصیت style قابل انجام است.

خاصیت style در اچ تی ام ال به نحوه ی زیر نوشته میشود:



این خاصیت تگ ها در اصل فعال کننده یک مجموعه Property در سی اس اس است.

در مورد سی اس اس در ادامه ی این آموزش بیشتر توضیح داده می شود.

برخی از رایج ترین مقادیر قابل استفاده در خاصیت Style شامل موارد زیر می شود:

رنگ پس زمینه اچ تی ام ال (Background-color)

ویژگی background-color در سی اس اس رنگ پس زمینه یک المان اچ تی ام ال را مشخص میکند. شما می توانید از این property سی اس اس در خاصیت style استفاده کنید تا رنگ پس زمینه المانی را تغییر دهید.

مثال پایین رنگ پس زمینه ی صفحه را به powderblue تغییر میدهد.

مثال:



رنگ متن اچ تی ام ال (Color)

ویژگی color رنگ نوشته را برای نوشته های درون یک المان اچ تی ام ال تعیین میکند.

مثال:



فونت های اچ تی ام ال (Font-family)

ویژگی font-family فونت مورد استفاده یک المان اچ تی ام ال را تعریف میکند. در وب سایت های فارسی زبان معمولا فونت Tahoma مورد استفاده قرار می گیرد. فونت های بسیاری به صورت پیشفرض در این Property سی اس اس قابل استفاده است، اما شما می توانید فونت دلخواه خود را نیز مورد استفاده قرار دهید که بعدا در آموزش CSS به شرح روش انجام آن خواهیم پرداخت.

مثال:



اندازه متن اچ تی ام ال (Font-size)

ویژگی font-size اندازه متن را برای یک المان اچ تی ام ال مشخص میکند. از مقادیر با واحد های px، em، pt یا درصد به طور معمول در این property استفاده می شود.

مثال:



جهت گیری متن اچ تی ام ال (Text-align)

ویژگی text-align جهت گیری افقی متن را برای یک المان اچ تی ام ال مشخص میکند. در زبان فارسی از text-align:right بسیار استفاده می شود.

به طور معمول در این property سی اس اس از مقادیر right,left,center و justify استفاده می شود.

در حالی که مقدار center متن را وسط چین می کند، مقدار justify متن را به دو سمت صفحه می کشد تا فضا های خالی را با متن پر کند.

مثال:



ویدیوها و مطالب مشابه