سبد (0)

تبلیغات

خصوصیت font

مثال (خصوصیت font)

مشخص کردن تمام ویژگی ها در یک تخصیص:

p.ex1
{
font:15px arial,sans-serif;
}

p.ex2
{
font:italic bold 12px/30px Georgia, serif;
}
خودتان امتحان کنید »

در انتهای این بیاموز، مثال های بیشتری را خواهید دید.


تعریف و کاربرد

با استفاده از خاصیت مختصر شده font، می توانیم تمام ویژگی های مربوط به فونت را در یک تخصیص، تنظیم کنیم.

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

  1. font-style
  2. font-variant
  3. font-weight
  4. font-size/line-height
  5. font-family

مقادیر مربوط به font-size و font-family اجباری هستند. اگر مقادیر مربوط به سایر خاصیت ها، از قلم بیفتد، مقدار پیش فرض (در صورت وجود) برای آن لحاظ می شود.

توجه: خاصیت line-height فاصله بین خطوط را تنظیم می کند.

مقدار پیشفرض مشخص نشده
ارث بری بله
نسخه CSS1
JavaScript ساختار object.style.font="italic small-caps bold 12px arial,sans-serif"

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت font را پشتیبانی می کنند.

توجه: مرورگر Internet Explorer 8 و نسخه های قبلی آن، تنظیم خاصیت font برای یک عنصر را پشتیبانی نمی کند.

توجه: مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقدار "inherit" را پشتیبانی نمی کند. IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار "inherit" را پشتیبانی می کند.


Font Properties

Property/مقدارتوضیحات
font-style Style یک فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-style مراجعه فرمایید.
font-variant کوچک یا بزرگ بودن حروف را مشخص می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به  font-variant مراجعه فرمایید.
font-weight ضخامت یک فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-weight مراجعه فرمایید.
font-size/line-height اندازه یک فونت و فاصله بین خطوط را مشخص می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-size و line-height مراجعه فرمایید.
font-family نام فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-family مراجعه فرمایید.
caption

از فونتی استفاده می کند که توسط کنترلهای caption به کار رفته است. (کنترلهای caption مانند Button و Drop-Down و غیره)

icon از فونتی استفاده می کند که توسط آیکن به کار گرفته شده است.
menu از فونتی استفاده می کند که توسط منوی پایین افتادنی استفاده شده است.
message-box از فونتی استفاده می کند که توسط پنجره پیغام استفاده شده است.
small-caption

یک ورژن کوچکتری از فونت caption

status-bar

از فونتی استفاده می کند که توسط نوار وضعیت استفاده شده است.

inherit تعیین می کند که باید از والدش، ارث بری داشته باشد.

مثالs

مثال - خودتان امتحان کنید

Some of the other font property values
در این مثال چند خاصیت دیگر مربوط به فونت نمایش داده شده است.


بیاموزهای مرتبط

Styling Fonts (بیاموز CSS)

دیدگاه‌ها  

0 # ali start 1394-06-08 13:23
با سلام
این مقدار inherit چیه که همه جا هست ولی هیچ مثالی براش نیاورده شده
همش در آخر هر آموزشی نوشته که باید از والدش ارث بری داشته باشد
خوب بعضی چیزا نمیتونن ارص بری داشته باشن
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # شهربانو دوستی 1394-06-08 22:24
با سلام
inherit یکی از خصوصیات تگ فونت است که باعث می شود فرزند خصوصیت والدش را به ارث ببرد :
body{
font-size:18px;
font-family:tahoma;
}
div{
font-size:inherit;
}

< body > test <div> test in div</div></body>
در این مثال هم test و هم test in div سایز 18 خواهند داشت.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی