آموزش رایگان html
جلسه هشتم

استایل ها در HTML

ویژگی استایل در HTML یا (style attribute) تنظیمات (ظاهری) مربوط به عناصر HTML ، توسط ویژگی style یا (style attribute) تعیین میشود.تنظیماتی مانند رنگ متن (color) ، رنگ پس زمینه (background) و … ویژگی استایل به صورت زیر در عناصر HTML استفاده می شود :

که در آن tagname نام تگ مورد نظر ، […]

ویژگی استایل در HTML یا (style attribute)

تنظیمات (ظاهری) مربوط به عناصر HTML ، توسط ویژگی style یا (style attribute) تعیین میشود.تنظیماتی مانند رنگ متن (color) ، رنگ پس زمینه (background) و …

ویژگی استایل به صورت زیر در عناصر HTML استفاده می شود :

که در آن tagname نام تگ مورد نظر ، property ویژگی که میخواهیم اضافه کنیم (مانند رنگ یا فونت یا …) و value مقداری است که برای ویژگی مورد نظر انتخاب میکنیم.

مثال

در مثال بالا رنگ متن سربرگ ما آبی رنگ خواهد شد.(مانند تصویر زیر)

 

ویژگی style در زبان html

 

در مراحل بعدی آموزش ، با ویژگی های css و نحوه استفاده از آن بیشتر آشنا خواهیم شد.

 

 

تغییر رنگ پس زمینه یا background color در HTML

به کمک ویژگی background-color ، میتوان برای یک عنصر HTML ، رنگ پس زمینه تعریف کرد.

در مثال زیر رنگ عنصر body (در بر گیرنده کل اجزای صفحه) را نارنجی (orange) تعریف میکنیم.

که نتیجه آن در مرورگر به صورت زیر خواهد شد

 

تغییر رنگ پس زمینه در html با background-color

 

 

تغییر رنگ متن در HTML به کمک ویژگی color

برای تعیین رنگِ متنِ یک عنصر HTML ، میتوان از ویژگی color استفاده نمود.

در مثال زیر ، رنگ عنصر سربرگ h1 را قرمز (red) و رنگ عنصر پاراگراف p را آبی (blue) تعریف کرده ایم:

که نمایش آن در مرورگر به صورت زیر خواهد بود

 

تغییر رنگ متن در html با خاصیت color

 

 

تعریف فوت برای متن در HTML به کمک ویژگی font-family

ویژگی font-family میتواند ، برای یک عنصر HTML یک فونت خاص را تعریف کند.

در مثال زیر برای سربرگ h1 فونت verdana و برای پاراگراف ، فونت courier را تعریف کردیم.

که نمایش آن در مرورگر بصورت زیر خواهد بود

 

تغییر فونت متن در html به کمک ویژگی font-family

 

 

تغییر اندازه متن در HTML به کمک ویژگی font-size

از طریق ویژگی font-size میتوان اندازه (سایز) متن یک عنصر در HTML را تعیین کرد.

در مثال زیر اندازه فونت عنصر سربرگ ، ۳۰۰% و اندازه فونت عنصر پاراگراف ۱۶۰% تعریف شده است.

که نمایش آن در مرورگر بصورت زیر خواهد بود:

 

تغییر سایز متن در HTML به کمک ویژگی font-size

 

مقدار سایز نوشته ها را هم میتوان بصورت درصدی بیان کرد (مانند مثال بالا) ، هم بصورت پیکسلی (مثلاً ۲۵px) و … که در مراحل بعدی بصورت کامل با آنها آشنا خواهیم شد.

 

تعیین تراز متن در HTML به کمک ویژگی text-align

تراز (جهت گیری) افقی متون عناصر در یک سند HTML ، از طریق ویژگی text-align تعریف میشود.

در مثال بالا تراز پاراگراف اول راست ، تراز پاراگراف دوم وسط و تراز پاراگراف سوم چپ تعریف شده است.

که نمایش آن در مرورگر بصورت زیر خواهد بود:

 

تعیین تراز متن در html به کمک ویژگی text-align

 

در مراحل بعدی آموزش (همچنین در بخش آموزش css) با سایر قابلیت ها و ویژگی های Style آشنا خواهیم شد و آنها را به تفصیل بررسی میکنیم.
کلیه حقوق مدرسه مجازی وب متعلق به گروه طراحی وب نگار میباشد.کپی برداری تنها با ذکر منبع مجاز میباشد.