صورت ,استایل ,سایت ,فونت ,سایز ,font ,آموزش طراحی ,background color

آموزش طراحی وب سایت

با  درود به همه دوستان با قسمت  دهم آموزش طراحی وب سایت در خدمتتون هستم،در این مقاله نیز راجع به سی اس اس ( css) و نحوه استایل دهی (Font-size  ,…. color, Background-color,) و گزینش گر متنی و سبک دهی گروهی صحبت خواهم کرد.با  لیزارد وب همراه باشید.
تا اینجای کار به چند مثال ساده اما کاربردی  با CSS  برای استفاده در وب سایت نگاهی انداختیم. برای استایل دهی خصوصیات بسیار زیادی وجود دارد که البته من قصد دارم آنها را اینجا لیست کنم، هرچند ممکن است شما تا به حال بعضی از این استایل ها و مقدار دهی آنها را تجربه کرده باشید.

نکته :  توجه داشته باشید که این استایل ها کل css نیست و در فصل های آینده به این مقادیر اضافه خواهد شد.

Color

همانطور که قبلا هم دیدید برای رنگ دادن به عناصر استفاده می شود.

Background-color

به دو صورت مقدار دهی می شود یا نام رنگ (blue, red, green,..)  یا با اعداد دسیمال،  مانند: #3acbef

Font-family

با این خصیصه هر فونتی را که بخواهید می توانید به متون سایت خود اعمال کنید، تنها توجه کنید که نحوه مقدار دهی آن همانند مثال های قبلی است که به طور مفصل راجب به آن توضیح داده ام.

Font-size

مقدار دهی آن می تواند مثل یکی از گزینه های زیر باشد:
1-    نام های آماده برای سایز دادن به فونت ؛

•    XX-small
•    X-small
•    Small
•    Medium
•    Large
•    X-large
•    Xx-large

2-    فونت دهی به صورت نسبی؛

•    به صورت درصدی : %120
•     به صورت  1.2em     : em

3-    فونت دهی به صورت مطلق؛

•    به صورت pixel  ، مانند:  px12
•    به صورت  point، مانند:  pt12

قطعاً زمانیکه بخواهیم این امکان را به خوانندگان مطالب وب سایتمان بدهیم که با تغییر سایز صفحه مرورگر خود ( مثلا سایز %150 به جای %100) بتوانند سایز فونت متناسب با آن را ببینند فونت دهی به صورت نسبی را مد نظرمان قرار می دهیم.


ضخامت فونت است که به دو صورت normal  یا  bold مقدار دهی می شود.

Font-style

سبک فونت است که به دو صورت normal   یا  italic مقدار دهی می شود.

Text-decoration

مدل دهی به متن به صورت: none, underline, overline  و یا line-through  است.

نکته : قبل از شروع به کار و استفاده از css های متنوع، ابتدا از css ای که تا کنون آن را ساخته اید یک back up بگیرید و سپس با استایل های مختلفی که در بالا یاد گرفتید استایل های مختلفی را بسازید.
تمامی موارد بالا را می بایست در مرورگر خود تست کنید تا با آنها آشنا شوید ولی حالا بیائید استایل دهی بیشتری برروی عناصر موجود در سایتمان اعمال کنیم.

ادامه

منبع :‌ www.lizard-webdesign.com

منبع اصلی مطلب : Lizard Web Design
برچسب ها : صورت ,استایل ,سایت ,فونت ,سایز ,font ,آموزش طراحی ,background color
اشتراک گذاری: این صفحه را به اشتراک بگذارید

پو اس ام اس : آموزش طراحی وب سایت ، قسمت دهم