ورود ثبت نام

font ها و رنگ ها در css

font ها و رنگ ها در css
به نام خدا در این جلسه قصد داریم font ها و رنگ ها در css را به شما آموزش دهیم.امروز یاد میگیرید که فونت ها رو چگونه به یک صفحه ی وب اضافه کنید و چگونه رنگ و اندازه ی آن را تغییر دهید.انتخاب فونت یکی از مهم ترین بخش های طراحی سایت است.شما باید بین فونت های پرطرفتار در حوزه ی وب یکی را برای سایت خود انتخاب کنید و از اول که شروع به طراحی میکنید، با اون فونت مورد نظر طراحی را ادامه دهید. در قسمت قبلی ما با سلکتور ها در css آشنا شدیم و فهمیدیم که برای استایل دهی به تگ ها اول باید آنها را سلکت کرد.حال میخواهیم فونت نوشته شده در آن تگ را تغییر دهیم.با ما همراه باشید.

فونت ها در css

اول کار میخواهیم ببینیم چجوری فونت دلخواه خودمونو به تگ مورد نظر اضافه کنیم:
خب اینجا ما اومدیم فونت tahoma رو به تگ div اختصاص دادیم.شاید سوال پیش بیاد که کاربری که سایت شمارو باز میکنه این فونت رو نداشته باشه.اونوقت چی میشه؟ شما باید فونتی که در فایل هایی که در سایت آپلود کردید رو این جا مشخص کنید.به این شکل:
با استفاده از قاعده ای به اسم @font-face شما میتوانید یک اسم دلخواه انخاب کنید که همان :font-family: myFirstFont; است. مورد بعد این است که باید آدرس آن فونت را وارد کنید.در html شما با آدرس ها آشنا شدید ولی اینجا باز هم میگوییم.
src: url('fonts/BYekan.ttf');
این خط آدرس فونت مورد نظر را مشخص میکند.fonts پوشه ای است که کنار فایل html وجود دارد.با استفاده از / شما داخل پوشه میشوید و میگویید محتوی BYekan.ttf را که داخل این پوشه هست را برای من لود کن.

font size

اگر شما بخواهید سایز یک فونت را تغییر دهید باید از پراپرتی font-size استفاده کنید.مقدار مختلفی را این پراپرتی به خود اختصاص میدهد. 3 نمونه از مقدار های مختلف را با هم بررسی میکنیم:
به کلاس parent مقدار 25px داده شده.px معمول ترین اندازه برای فونت هاست.مرورگر ها به صورت پیش فرض فونت آنها 16px است.ولی ما اینجا به صورت دستی 25px دادیم.کلاس child که فرزند parent هست سایز 100% داده شده است.% که در فصل های آینده به آن برخورد خواهیم کرد،یعنی همان مقداری که فونت پدر یعنی 25px است،به فرزند هم همین سایز داده شود.و مورد آخر که کلاس em است،اندازه ی 2em داده شده است.em همان px است ولی بر طبق یک فرمول عمل میکند:
1em : 16px
2em : 2 * 16px = 32px
سایز پیش فرض 16 است.پس اندازه ی em ضرب در اون عدد پیش فرض میشود.2em یعنی 2 ضرب در 16px. مورد بعدی رنگ نوشته هاست که میشه گفت ربطی به font ها ندارد و پراپرتی جداگانه به اسم color دارد:
color:red;
مطمئنن کسانی که css کار کردند یا آشنایی نسبی با این زبان دارند،میدانند که خصوصیت های بسیاری این زبان دارد.مثلا همین font ها خصوصیتی به اسم font-variant دارد که باعث میشود تک تک حرف ها به صورت حروف بزرگ انگلیسی نوشته شوند ولی اندازه ی آنها همانند اندازه ی حروف کوچک است.ما نمیخواهیم الان تک تک این خصوصیت ها را به شما بگوییم.اسم این سری از آموزش ، آموزش قدم به قدم css هست،و ما خصوصیت های css را به طوری که برای طراحی وب مخصوص مبتدیان مفید باشد میگوییم.در قسمت های آینده به صورت آموزش یا پروژه محور با تمام این خصوصیت ها آشنا خواهید شد.و از حالت مبتدی به پیشرفته تبدیل خواهید شد. تا قسمت بعد...

0 465

telegram mosqdevelopers


دسته بندی ها

ios

پست های اخیر

banner

کاربردها و فرصت های شغلی زبان برنامه نویسی جاوا

زبان برنامه نویسی جاوا در ا...

ادامه مطلب


banner

ساخت جداول گوناگون در css

به نام خدا. در این قسمت میخوا...

ادامه مطلب


banner

کتابخوان های الکترونیکی برتر

به نام خدا ؛ تاحالا شده وقتت ت...

ادامه مطلب


banner

لاراول 6

انتظار ها به سررسید و سرانجام...

ادامه مطلب


banner

padding ها در css

به نام خدا در این قسمت قسط د...

ادامه مطلب


RSS RSS

نظرات ارزشمند خود را در مورد وبسایت با ما در میان بگذارید

© کلیه حقوق مادی و معنوی متعلق به تیم برنامه نویسی Mosquito Network می باشد