آموزش فونت های وب در CSS3
آموزش فونت های وب در CSS3
در این درس از مجموعه آموزش برنامه نویسی سایت سورس باران، به آموزش فونت های وب در CSS3 خواهیم پرداخت.
فونت های وب برای اجازه دادن به فونت ها در CSS استفاده می شوند، که روی سیستم محلی نصب نشده اند.
- (TrueType Fonts (TTF
TrueType یک استاندارد فونت طرح کلی است که توسط اپل و مایکروسافت در اواخر دهه ۱۹۸۰ ساخته شده است و به رایج ترین فونت ها برای هر دو سیستم عامل ویندوز و MAC تبدیل شده است.
- (OpenType Fonts (OTF
OpenType قالبی برای فونت های قابل مقیاس پذیری رایانه است و توسط مایکروسافت ساخته شده است
- (The Web Open Font Format (WOFF
WOFF برای توسعه صفحه وب استفاده می شود و در سال ۲۰۰۹ توسعه یافته است. اکنون با استفاده از توصیه W3C از آن استفاده می شود.
- SVG Fonts/Shapes
SVG فونت های SVG را در اسناد SVG مجاز می داند. همچنین می توانیم CSS را با ویژگی font face به SVG اعمال کنیم.
- (Embedded OpenType Fonts (EOT
EOT برای توسعه صفحات وب استفاده می شود و در صفحات وب جاسازی شده است ، بنابراین نیازی به اجازه دادن به قلم های شخص ثالث نیست
کد زیر کد نمونه فونت face را نشان می دهد –
<html>
<head>
<style>
@font-face {
font-family: myFirstFont;
src: url(/css/font/SansationLight.woff);
}
div {
font-family: myFirstFont;
}
</Style>
</head>
<body>
<div>This is the example of font face with CSS3.</div>
<p><b>Original Text :</b>This is the example of font face with CSS3.</p>
</body>
</html>
این نتیجه زیر را ایجاد می کند –
This is the example of font face with CSS3. Original Text :This is the example of font face with CSS3.
توضیح فونت ها
لیست زیر شامل تمام توضیحات فونت هایی است که در قانون font-face@ قرار داده شده است –
- font-family
برای تعریف نام فونت استفاده می شود
- src
برای تعریف URL استفاده می شود
- font-stretch
برای یافتن چگونگی کشیده شدن فونت استفاده می شود
- font-style
برای تعریف سبک قلم ها استفاده می شود
- font-weight
برای تعریف وزن فونت (بولد بودن) استفاده می شود
لیست جلسات قبل آموزش CSS
- آموزش CSS
- CSS چیست؟
- آموزش نحو CSS
- آموزش قوانین CSS
- آموزش واحد انداره گیری در CSS
- آموزش رنگ ها در CSS
- آموزش Background در CSS
- آموزش فونت ها در CSS
- آموزش استفاده از تصاویر در CSS
- آموزش استفاده از تصاویر در CSS
- آموزش استفاده از لینک ها در CSS
- آموزش جداول در CSS
- آموزش حاشیه در CSS
- آموزش margin در CSS
- آموزش لیست ها در CSS
- آمورش ویژگی padding در CSS
- آموزش ویژگی مکان نما در CSS
- آموزش outline در CSS
- آموزش ابعاد در CSS
- آموزش نوارهای پیمایشی در CSS
- آموزش visibility در CSS
- آموزش موقعیت یابی در CSS
- آموزش لایه ها در CSS
- آموزش شبه کلاس ها در CSS
- آموزش شبه عناصر در CSS
- آموزش قوانین @ در CSS
- آموزش فیلترهای متنی و تصویری در CSS
- آموزش انواع رسانه ها در CSS
- آموزش مدیا صفحه در CSS
- آموزش رسانه شنیداری در CSS
- آموزش چاپ در CSS
- آموزش طرح بندی در CSS
- آموزش CSS3
- آموزش گرد کردن گوشه ها در CSS3
- آموزش حاشیه تصویر CSS3
- آموزش تنظیم چند پس زمینه در CSS3
- رنگ ها در CSS3
- آموزش گرادیان در CSS3
- آموزش سایه در CSS3
- آموزش تکست در CSS3
.svg)
دیدگاه شما