قسمت سی و سوم bootstrap : نحوه ی استفاده از آیکون ها در بوت استرپ 4

نویسنده:

مرتضی افضلی

Statistics-rafiki

تعداد بازدید:

Calendar-amico (2)

تاریخ به‌روزرسانی:

1400-05-11

Work time-rafiki

زمان مطالعه:

5 دقیقه

آیکون ها در طراحی های سایت بسیار کاربردی اند ، برای ایجاد ظاهر بهتر در طراحی ها و ایجاد خط مسیرهای بهتری برای کاربران از آیکون ها استفاده می کنیم.

آیکون ها در بوت استرپ 4

متاسفانه در بوت استرپ 4 به صورت مستقل آیکونی وجود ندارد . برای ایجاد آیکون ها می توانیم از فونت آیکون هایی مانند Font Awesome و Google Material Design Icons استفاده کنیم.

برای استفاده کردن از Font Awesome می توانید قطعه کد زیر را در تگ head خود قرار دهید :

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">

پیشنهاد می کنم برای درک بهتر این موضوع به جلسه ی اول آموزش بوت استرپ یا همان نصب بوت استرپ 4 مراجعه فرمایید.

برای افزودن آیکون ها از تگ هایی مانند <i> یا <span> استفاده می کنیم.

 <i class="fas fa-cloud"></i>
<i class="fas fa-coffee"></i>
<i class="fas fa-car"></i>
<i class="fas fa-file"></i>
<i class="fas fa-bars"></i> 

پیشنهاد میکنم برای دریافت اطلاعات بیشتر راجع به آیکون ها به سایت fontawesome.com مراجعه فرمایید.

همچنین برای آموزش های بیشتر به دوره رایگان بوت استرپ 4 مراجعه فرمایید.

Picture of مرتضی افضلی

مرتضی افضلی

این روزها دیگر نیاز نیست کلی هزینه‌ی اجاره‌ی مغازه بدهید. با دنیای کسب‌وکار اینترنتی و دیجیتال مارکتینگ می‌توانیم کسب درامد داشته باشیم و من در مجموعه‌ی کدپز در این راه همراه شما هستم.

تا کنون 264 نفر در کدپز ثبت نام کرده اند.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *