آموزش سایه ها (Box Shadow)

( )

حق کپی ویدئو

مجاز نمی باشد.

شما اینجا هستید :

جلسه پنجاه و دو

آموزگار :

مهدی جبین پور

در این قسمت از آموزش طراحی سایت وردپرس با ایجاد سایه برای عناصر و آیتم های صفحه آشنا خواهید شد. از ویژگی سایه(Box Shadow) برای اضافه کردن سایه به المان ها و آیتم های موجود در سایت استفاده می شود.
( ادامه مطلب … )

ابزار وردپرس بُزرگ ترین مرجع وردپرس ایران!

آنچه توانسته ایم لطف خدا بوده است ، ابزار وردپرس بعنوان یکی از مراجع بزرگ طراحی وب و وردپرس در حال فعالیت می باشد 🙂

ابزار وردپرس بُزرگ ترین مرجع وردپرس ایران!

آنچه توانسته ایم لطف خدا بوده است ، ابزار وردپرس بعنوان یکی از مراجع بزرگ طراحی وب و وردپرس در حال فعالیت می باشد 🙂

اورجینال

کیفیت

پشتیبانی

آپدیت

مهدی جبین پور

مـهـدی جـبین پـور

دانشجوی دکتری تجارت الکترونیک ، امیدوارم بتوانم خدمتگزار خوبی برای مردم کشورم باشم.

مهدی جبین پور

مـهـدی جـبین پـور

دانشجوی دکتری تجارت الکترونیک ، امیدوارم بتوانم خدمتگزار خوبی برای مردم کشورم باشم.

آموزش سایه ها (Box Shadow)

( )

اضافه کردن سایه با امکانات قالب و صفحه ­ساز

برای ایجاد سایه به المان­ ها در صفحه­ ساز ویژوال کامپوزر، المان را در حالت ویرایش باز کنید و در صفحه تنظیمات المان، سربرگ “طراحی” بخش “باکس سایه­” را اتخاب نمایید.

انحراف افقی نمایانگر سایه در راستای افق (x) و انحراف عمودی، سایه در راستای عمود(Y)  است. جعبه بلور میزان مات و تاری سایه و جعبه گسترس مقدار پراکندگی سایه را مشخص می­ کنند. همچنین رنگ سایه را با انتخاب رنگ دلخواه از جعبه رنگ می­توانید تغییر دهید.

اضافه کردن سایه با افزونه مداد زرد

در صورتی­ که قالب شما ازShadow Box پشتیبانی نکند می­توانید از افزونه مداد زرد برای ایجاد سایه به المان­ ها استفاده کنید. برای آشنایی با افزونه مداد زرد کلیک کنید.

در صفحه ویرایش مداد زرد، المانی که می­خواهید به آن سایه اختصاص دهید را انتخاب کنید. از منو سمت راست،  قسمت Shadow را کلیک کرده و مقدارهای سایه را تعیین نمایید.

جالب است بدانید با کمک افزونه مداد زرد امکان اضافه کردن سایه به متن نیز وجود دارد.

برای اضافه کردن سایه به متن، در افزونه مداد زرد متن را در حالت انتخاب قرار داده و از منو سمت راست >  Text > Text Shadow را کلیک و از جعبه بازشونده انواع مختلف سایه را انتخاب کنید.

برای نوشتن دیدگاه باید وارد بشوید.

13 دیدگاه. Leave new

  • رضا مودی
    2023-09-27 20:47

    سلام وقت بخیر جسارتا برای حالت نیمه شفاف بودن باکس که اگر تصویری پشت باکس ما بود رو بصورت نیمه شفاف نمایش بده باید چیکار کرد بدون کد زدن 😊

  • عادله یزدی
    2023-01-07 15:32

    سلام
    ممنون بابت وقتی که برای این آموزش ها گذاشتید.
    افزونه owl crousel slider با قالب زفایر همخوانی داره؟
    امکان مشابهی در زفایر هست که اسلایدر کنه؟

  • لیلا پناهی
    2022-09-12 18:17

    سلام الان تخفیفات برای همه محصولاتتونه؟

  • احمد احمدی
    2022-04-08 04:20

    با عرض سلام و خسته نباشید.
    سوال بنده این هستش که وقتی استاد جبین پور میرن روی حالت inspect element من متوجه نمیشم دقیقا چیکار میکنند که می تونند همونجا کد css رو دستکاری کنند و مانند یک editor نتیجه رو آنلاین ببینند. من وقتی همین مسیر و رو دنبال می کنم کد های مروبط به css غیر قابل تغییر می شوند.

    • علی حیدری
      2022-04-08 12:35

      وقت بخیر
      آموزش را با دقت مشاهده نمایید. ویدئو دقیق تر توضیح می دهد.
      کد css در این بخش قابل ویرایش نیست، می توانیم ویرایش و تغییرات موقت و ساده خود را انجام دهیم تا کد را در بخش نمایش> سفارشی سازی > css اضافی قرار دهیم.
      با تشکر.

  • بسیار ممنون از تمامی کسایی که برای ویدیوها زحمت میکشند، مخصوصا آقای جبین پور عزیز

  • reza ghaderi
    2020-10-04 12:30

    امکان اش هست تخفیف بعدیتون برای افزونه مداد زرد باشه؟

فهرست