تنظیم قلم و فونت CSS Styling Font

در این بخش از آموزش css ،  م خواهیم Styling Font را آموزش دهیم. در css دو نوع از خانواده فونت ها وجود دارد.

• “generic family” مثل  “Serif” یا “Monospace”
• “font family” مثل “Times New Roman” یا “Arial”

با ویژگی font-family شما می توانید نوع قلم مورد نظر را برای متن تنظیم کنید، چنانچه می خواهید از یک فونت خاص استفاده کنید، نوع فونت مورد نظر خود را اول بنویسید. چون ممکن است این فونت در کامپیوتر های دیگر موجود نباشد و باعث بهم ریختگی نظم خطوط شود.

می توانید نام چند فونت دیگر را نیز وارد کنید.

حتما بخوانید: محل قرارگیری عناصر – خواص Clear , Float

برای مثال :

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

در صفحات نمایش کامپیوترها فونت های خانواده sans-serif نسبت به فونت های خانواده serif آسانتر خوانده میشوند و عمومی تر هستند.

یکی از نکات مهم در طراحی سایت استفاده از فونت استاندارد برای شکیل نشان دادن صفحات وب سایت شما می باشد.

Font Style
با این ویژگی شما نوع نمایش متن را مشخص می کنید. این ویژگی دارای دومقدار زیر می باشد :

1.  normal   :متن به صورت معمولی نمایش داده می شود.
2.  italic   : متن به صورات ایتالیک نمایش داده می شود.
3.  oblique  :  متن به صورت مورب نمایش داده می شود.

مثال : 

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

Font Size
این ویژگی سایز متن را مشخص می کند. اندازه متن در طراحی وب سایت بسیار حائز اهمیت است. ویژگی font-size را می توانید به صورت مطلق یا نسبی مقداردهی کنید.

اگرچه در زوم و رزولیشن های مختلف این مقدار تغییر می کند. ولی این تغییر اندازه برای کل صفحه می باشد و شامل یک بخش نیست. سایز پیش فرض برای یک متنن نرمال 16px تعریف می شود.

برای متن هایی که در بالای صفحه (header) نمایش داده می شوند از تگ های <h1> – <h6> و تگ <p> برای پاراگراف های خود استفاده کنید، در مورد این تگ ها در قسمت آموزش HTML می توانید بیشتر اطلاعات کسب کنید .
مثال :

h1 {font-size:30px;}
h2 {font-size:20px;}
p {font-size:14px;}

تنظیم FONT با واحد EM
در نسخه های اولیه Internet Explorer به دلیل پشتتیباتی نشدن واحد px بسیاری از طراحان از واحد em استفاده می کردند.
هر 1em رابر با 16px میباشد.
مثال :

h1 {font-size:2.5em;} /* 40px/16=2.5em */

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

با دریافت « مشاوره برنامه‌نویسی، وب و سئو » از کارشناسان جوان حرفه‌ای و باتجربه ساکوراد؛ موفقیت کسب و کار، رونق فروش و افزایش درآمد خود را تضمین کنید!

و اما کلام آخر…