آموزش بوت استرپ (گام 5) فونت آیکون

دوره بوت استرپ آوریل 2015 28

طبق درخواست مکرر دوستان و استقبال مناسبی که شد قسمت پنجم آموزش فریم ورک بوت استرپ را تقدیمتان میکنم. در این قسمت با پکیج فونت آیکون آشنا خواهید شد. فیلم این قسمت را میتوانید از باکس زیر دانلود کنید :

دانلود فیلم آموزشی
لینک دانلود32 مگابایت17 دقیقه

برای استفاده از آیکون های موجود در پکیج بوت استرپ باید از تگ <span> برای فراخوانی کلاس glyohicon استفاده کنیم. در نهایت نام آیکون مورد نظر را بصورت کلاس به این تگ اضافه میکنیم :

در css و یونیکد برای اینکه فونت ما را به عنوان یک آبجکت تزپینی بشناسد شناسه aria-hidden را برابر true قرار میدهیم :

 

لازم به ذکر است برای تغییر سایز از خاصیت font-size و برای تغییر رنگ از خاصیت color در css استفاده میشود.

دیدگاه ها
  • fatemeh-rad گفت:

    با تشکر از آپ دیت سریع آموزش هاتون

    • حسین شفیعیان گفت:

      بنا به استقبال و درخواست شما دوستان گرامی بروز شد

      • خانوم گل گفت:

        باسلام، لطفا اگر میشه تمام آموزش ها، بخصوص بوت استرپ رو در سایت آپارات آپلود کنید و لینکشو توئ سایتتون قرار بدید، که نیازی به دانلود نباشه. ممنون از آموزش های کاربردی ومفیدتون.

        • حسین شفیعیان گفت:

          آپارات کیفیت ویدیو ها رو خراب مبکنه اما سعی میشه آموزش ها در کانال آپارات هم قرار بگیره

  • سیدرضا سیدموسوی گفت:

    سلام حسین جان
    بابت اپدیت خیلی ممنون خدا خیرت بده

  • سیدرضا سیدموسوی گفت:

    سلام
    فک کنم لینک دانلود خرابه

  • ali_nilofar گفت:

    باز هم گل کاشتید استاد.
    لطفا همین طور زود به زود آپدیت کنین.
    خیلی ممنون

    • حسین شفیعیان گفت:

      مرسی تشکر
      سایر دوره ها هم هستند که اونها هم باید بروز بشن ولی با توجه به استقبال شما دوستان بنده هم توجه خاصی به ادامه این آموزش ها خواهم داشت 😀

  • mehran گفت:

    Mer30 Mr Programmer

  • danger1875 گفت:

    آقای برنامه نویس خیلی آقایی 😉
    اگه وقت داری دوره حرفه ای PHPرو هم شروع کن
    باتشکر

    • حسین شفیعیان گفت:

      مرسی تشکر
      فعلا که حوصله شروع یه دوره جدید را ندارم , دوره های فعلی رو باید تموم کنم اما تو برنامه ام هست نگران نباشید 😉

  • Rezai گفت:

    اقا حسين شما چند تا زبان برنامه نويسي بلدى اين بوت استرپ چيه و براي چي استفاده ميشه لطفاً يك كم توضيح بديد ممنون

  • danger1875 گفت:

    خب باشه پس بیشتر روی بوت استرپ تمرکز کن

  • mostafa گفت:

    عجب اموزش هلویی بود حسین جان

  • ali_nilofar گفت:

    استاد اگه امکانش هست به آپلود و ادامه آموزش ها سرعت ببخشین
    ممنون

  • simin گفت:

    آقای شفیعیان
    ممنون از آموزش هاتون، اما خیلی دیر یه دیر آپدیت می کنین.
    لطفا یه مقدار بیشتر آخه اینجوری تا ظهور امام زمان طول میکشه ممنون

    • حسین شفیعیان گفت:

      بنده بنا به استقبال و میزان کامنت های هر دوره اون رو بروز میکنم و اگر به تعداد مورد نیاز نرسه متوجه میشم کاربر به این دوره زیاد نیاز نداره !
      البته آموزش های سایت در راستای برنامه نویسی هست نه طراحی اما اگر کاربران درخواست کنند حتما در برنامه های آموزشی قرار خواهد گرفت.
      موفق باشید

  • رضا گفت:

    سلام فیلم آموزشی جدید
    وردپرس بذارید زمان انتظار ما خیلی طولانی شده
    ما همچنان منتظر هستیم

  • fatemeh-rad گفت:

    سلام،خسته نباشید.
    لطفأ آموزش جدید بوت استرپ رو هم بذارید.فکر کنم بیشتر از یک هفته شده از آخرین آموزشتون.
    با تشکر

  • حسين گفت:

    سلام خسته نباشي به خاطر اموزش هاي خوبت که واقعا تا اينجاش مفيد بود البته ابتدايي اما کاربردي.
    سوال من از شما
    من تو طراحي با بوت استرپ مشکلي ندارم اما ميخوام قالب رو به وردپرس تبديل کنم مشکل دارم و ميشه بکيد بايد چطور اين کارو کنم؟

    • حسین شفیعیان گفت:

      سلام و تشکر
      باید به توابع وردپرس آشنایی داشته باشی , بزودی دوره ساخت قالب وردپرس را منتشر میکنم

  • ali_nilofar گفت:

    استادفاصله بین آپلود این قسمت طولانی شده، یه فکری بکنین لطفا

    • حسین شفیعیان گفت:

      فعلا که درگیر امتحان های نیم ترم و پایان ترم هستم ولی تو فکرش هستم نگران نباشید

  • hamed_z2001 گفت:

    سلام مهندس. واقعا ممنون ، سایت عالی و کاربردی ای دارید ….
    استاد نزدیک یه ماه از آخرین آپدیت میگذره …
    کی ایشالا قسمت بعدی رو میذارید؟؟
    چند قسمت کلا داره؟؟

    • حسین شفیعیان گفت:

      سلام و تشکر
      درگیر امتحان های میان ترم و پایان ترم هستم , انشالله از دو هفته دیگه مجددا فعالیت سایت رو آغاز میکنم
      دوره بوت استرپ هم فک کنم ۱۵ قسمتی بشه

  • mohammad36987 گفت:

    سلام
    بوت استرپ من با این که نسخه ی جدیده و چندین بار هم از خود سایت بوت استرپ دانلود کردم اما تعداد زیادی از آیکون ها کار نمی کنه مشمل کجاست؟
    ممنون

    • حسین شفیعیان گفت:

      سلام
      فایل ها رو دقیقا جایگزین کن !
      چند بار رفرش کن شاید کش داری !
      شاید هم درست استفاده نکردی !

  • hasan.r گفت:

    سلام حسین جان
    یه سوال دیگه داشتم میتونی یه توضیحی درباره هاست دانلود بگی داخله گوگل سرچ کردم اما چیزه به درد بخوری پیدا نکردم.ممنون

    • حسین شفیعیان گفت:

      سلام
      یکم واضح تر بگید دقیقا به چی نیاز دارید
      لطف کنید بحث را در انجمن مطرح کنید: forum.mrprogrammer.net

  • hassan گفت:

    سلام حسین جان
    آیکونی که من نیاز دارم توی آیکون های پیش فرض بوت استرپ نیست چطوری میتونم اضافه کنم؟

  • محسن گفت:

    سلام
    کاربرد
    شناسه aria-hidden
    متوجه نشدم میشه بیشتر توضیح بدید

  • وحید گفت:

    سلام مهندس
    آقا من طراحی کردم ولی آیکون هارو نمیاره
    ورژن همه بوت استراپ هارو هم امتحان کردم
    جی کوئری من 1.14 هستش
    نمیدونم آیکونهارو نشون نمیده
    قبلا میداد بعد ی مدت دیگه نشون نداد

  • مجتبی گفت:

    سری آموزش هاتون بسیار عالیست دوست عزیزم
    موفق و پیروز باشین

  • xiaoyu گفت:

    سلام اقای برنامه نویس.سایت خیلی خوب و مفیدی دارین.
    یه سوال داشتم .اگه ما یک قالبو با بوسترپ بسازیم و بعدش بخوایم اونو تبدیل به وردپرس بکنیم.خیلی سخته؟؟!!!
    من الان طراحی سایت بلدم و ریسپانسیو کردنشو بلد نیستم.من می خوام قالب وردپرس بسازم.به نظرتون این اموزش رو یاد بگیرم؟
    ببخشید من تازه کارم شاید سوالام ابتدایی باشه.

    • حسین شفیعیان گفت:

      سلام
      برای سخت قالب برای وردپرس باید کمی PHP بلد باشین و به توابع وردپرس آشنا باشین
      که شع میکنم آموزش هاشو بزارم تو سایت
      شاید برای دفعات اولیه یکم سخت باشه

  • xiaoyu گفت:

    دستتون درد نکنه ..ممنون..
    انشالله اموزش قالب وردپرس رو هم اگه میشه زود بزارین.