آموزش منطق و مقدمات برنامه نویسی به همراه الگوریتم و فلوچارت آموزش منطق و مقدمات برنامه نویسی به همراه الگوریتم و فلوچارت

آموزشگاه برنامه نویسی تحلیل‌داده

با مجوز رسمی از سازمان فنی و حرفه‌ای کشور

ورود / ثبت‌نام

ورود کاربر جدید هستید؟ ثبت نام کنید
بستن تبلیغات
دوره طراحی سایت حرفه‌ای با پروژه واقعی!

دوره جامع و پروژه‌محور طراحی وب با تمرکز روی JavaScript، Ajax و API! با طراحی ریسپانسیو و پروژه‌های حرفه‌ای مثل دیجی‌کالا و شمرون کباب مهارتت رو حرفه‌ای کن!

مشاهده بیشتر
آموزش تخصصی فرانت‌اند با پروژه عملی

این دوره شما رو از مفاهیم پایه تا مباحث پیشرفته مثل JavaScript، React و Next.js پیش می‌بره. با آموزش پروژه‌محور، یک فروشگاه اینترنتی کامل طراحی می‌کنید و برای ورود به بازار کار آماده می‌شید!

مشاهده بیشتر

آموزش فونت در CSS

فونت در CSS

CSS به شما امکان می‌دهد تا نوع، اندازه، سبک و وزن فونت را برای متون وب‌سایت خود تنظیم کنید. این ویژگی‌ها به بهبود خوانایی و زیبایی وب‌سایت کمک می‌کنند.

آموزش css

خانواده‌های فونت (Font Family)

فونت‌ها به دو دسته تقسیم می‌شوند:

  • خانواده عمومی (Generic Family): مانند Serif یا Monospace
  • خانواده خاص (Font Family): مانند Times New Roman یا Arial
خانواده عمومی
خانواده خاص
توضیح
Serif
Times New Roman, Georgia
دارای خط‌های کوچک در انتهای کاراکترها
Sans-serif
Arial, Verdana
بدون خط انتهایی
Monospace
Courier New, Lucida Console
تمامی کاراکترها عرض یکسان دارند
نکته:

چنانچه اسم یک خانواده ی فونت (font family) متشکل از چندین حروف (بیش از یک حرف) باشد، در آن صورت باید اسم فونت مزبور را داخل کاراکتر یا علامت نقل و قول دوتایی (double quotation) قرار دهید، مثال : "Times New Roman"


    p {font-family: "Times New Roman", Times, serif;}

سبک فونت (Font Style)

Font style یا همان سبک فونت عمدتا به منظور مشخص کردن متن ها و نوشته های خوابیده و حروف کج بکار می روند . خصوصیت نام برده سه مقدار متفاوت دارد :

  • normal : که در آن متن به صورت عادی نمایش داده می شود.
  • Italic : که متن به صورت خوابیده نشان داده می شوند .
  • Oblique : که در آن نوشته یا حروف درست مشابه italic متمایل شده یا کج می شوند (بیشر به منظور شبیه سازی حالت italic یا حروف خوابیده بکار می رود) .

    p.normal {
        font-style: normal;} 
    p.italic {
        font-style: italic;}
    p.oblique {
        font-style: oblique;}

اندازه ی فونت (Font Size)

اندازه فونت را می‌توان به‌صورت مطلق (پیکسل) یا نسبی (em) تعریف کرد.

اندازه ی مطلق

نوشته را به یک اندازه ی تعریف شده تنظیم می کند. به کاربر اجازه ی تغییر اندازه ی متن را در همه ی مرورگرهای موجود نمی دهد (بنا به دلایل دسترسی نامناسب است). اندازه ی مطلق زمانی کاملاً کارامد تلقی می گردد که اندازه ی خروجی از پیش برای شما تعریف شده و مشخص باشد .


    h1 {
        font-size: 40px;}    
    h2 {
        font-size: 30px;}
    p {
        font-size: 14px;}    
نکته:

در صورتی که اندازه ی فونت را مشخص نکنید، اندازه ی پیش فرض برای نوشته های معمولی مانند پاراگراف ها که 16px (16px=1em) است مورد استفاده قرار می گیرد .

اندازه نسبی

برای اجازه دادن به کاربرها جهت اندازه بندی مجدد متن (قابل دسترسی از طریق فهرست گزینش مرورگر مربوطه)، بسیاری از طراحان وب به جای استفاده از پیکسل، واحد em را بکار می برند . W3C بهره گیری از واحد اندازه بندی فوق را به طراحان وب توصیه می کند . 1em در واقع معادل با اندازه ی فعلی فونت می باشد . اندازه ی پیش فرض نوشته در مرورگرهای کنونی برابر است با 16px . بنابراین، اندازه ی پیش فرض 1em به عبارتی همان 16px است . با بهره گیری از فرمول ذیل می توان واحد پیکسل را به em محاسبه و تبدیل کرد :


    h1 {
        font-size: 2.5em; /* 40px/16=2.5em */}    
    h2 {
        font-size: 1.875em; /* 30px/16=1.875em */}
    p {
        font-size: 0.875em; /* 14px/16=0.875em */}    

استفاده از درصد:


    body {
        font-size: 100%;}    
    h1 {
        font-size: 2.5em;}    
    p {
        font-size: 0.875em;}    

وزن فونت (Font Weight)

با font-weight می‌توانید وزن یا ضخامت متن را تنظیم کنید.

مقدار
توضیح
normal
وزن عادی
bold
ضخیم
100 - 900
مقدار عددی بین 100 (باریک) تا 900 (ضخیم)

جمع بندی

تمامی خصوصیت های فونت CSS در جدول زیر با ذکر شرح کاربرد فهرست شده اند :

توضیح
خاصیت
کلیه ی خصوصیت های فونت را طی یک تعریف تنظیم و انتخاب می کند
font
Specifies the font family for text اسم فونت مورد نظر را مشخص می کند (خانواده ی فونتی که برای متن بکارگرفته می شود را تعیین می کند)
font-family
اندازه ی فونت (قلم نوشته) را برای نوشته ی مورد نظر تنظیم می کند
font-size
سبک فونت انتخابی را برای متن مشخص می کند
font-style
مشخص می کند آیا یک متن با قلم نوشته (font small-caps) نمایش داده شود یا خیر
font-variant
این خصوصیت میزان توپر بودن (Weight) متن را تعریف می کند
font-weight
1403/07/26 12895 4444
رمز عبور : tahlildadeh.com یا www.tahlildadeh.com
نظرات شما
برای ارسال سوال لازم است، ابتدا وارد سایت شوید.