خصوصیت 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)