• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

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



  آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

آموزش طراحی متریال با Materialize (جلسه 13) - Chips و Footer

0 308 ۶ اردیبهشت ۹۵

در این جلسه با ادامه موضوع مربوط به طراحی متریال با Materialize در خدمتتون هستم.getting-started-materialize-css-framework

در مورد Chips

Materialize یک جزء مخصوص فراهم کرده و اسم اون رو chip یا تراشه یا ورقه قرار داده و میتونین با استفاده مجموعه های کوچکی مثل تگها و اطلاعات تماس و .... رو درست کرده و قرار بدید. با دادن کلاس chip به div مورد نظرتون اون رو بصورت یک تراشه یا چیپس در میارید و میتونین مواردی که میخاید رو در اون قرار بدین. متن و عکس و آیکون میتونه در این chip قرار بگیره.

عکس و متن در Chip:

خروجی:chip1

میبینید که موارد مورد نظر قرار داده شدن. عکسی هم که در chip قرار میگیره ارتفاعش 42 میشه و بصورت دایره ای در میاد.

متن و آیکون در Chip:

خروجی:chip2

زمانی هم که بر روی آیکون کلیک میشه، chip مورد نظر حذف میشه.

در مورد Footer

Materialize کلاسهایی مرتبط با فوتر یا Footer داره و میتونین با استفاده از اونا فوتر مورد نظرتون رو برای سایتتون قرار بدین.

  • page-footer : با نسبت دادن این کلاس به div مورد نظر باعث میشید که اون المنت بصورت فوتر در بیاد
  • footer-copyright : با استفاده از این کلاس، المنت مورد نظر به یک المنت footer-copyright تبدیل میشه و میتونین متن copyright رو در اون قرار بدین.

مثالها

همونطور که دیدید به المنت footer کلاس page-footer دادیم و محتوای مورد نظر رو درونش قرار دادیم.

خروجی بصورت زیر هست:footer1

حالا میتونیم کلاس footer-copyright رو هم در المنت بالا قرار بدیم:

خروجی بصورت زیر خواهد شد:footer2

امیدوارم از این مطلب خوشتون اومده باشه.

موفق و پیروز باشید

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

:: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
عضویت/ ورود سریع با :
در حال اتصال ...

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :
7LearnTelegram