ویژگی background-clip تعیین می کند که پس زمینه عنصر در کدام ناحیه و یا ناحیه ها ترسیم شود. هر عنصر از لحاظ مدل قسمت بندی دارای چهار ناحیه است که این نواحی شامل ناحیه محتوا (content-box), ناحیه فاصله داخلی (padding-box) و ناحیه حاشیه (border-box) و در نهایت ناحیه فاصله خارجی یا (margin-box) هستند. در حالت […]
در این مطلب قصد معرفی یک دمو برای پخش آهنگ مردم توسط استاد معین را داریم. طرح آسمان از این دمو گرفته شده و با استفاده از Canvas دوباره سازی شده است. همینطور طرح پخش کننده موسیقی از این دمو گرفته شده و بصورت واکنشگرا دوباره سازی شده است و قابلیت نمایش نوار پیشرفت نیز […]
احتمال دارد حتی اگر یک بار فوتوشاپ یا ابزارهای گرافیکی شبیه به آن را باز کرده باشید کلماتی مثل multiply, screen و overlay را دیده باشید. این کلمات حالت هایی از آمیختن اشیا گرافیکی هستند که با تشکر از تیم Adobe Web Platform امروزه ما می توانیم از این حالت ها و جلوه ها در […]
در اینجا به نمایش چند مثال جالب در مورد آمیختگی در CSS می پردازیم. اگر با این مبحث آشنایی ندارید به این مطلب مراجعه کنید. دموی های زیر توسط بنده طراحی نشدند اما اگر در مورد هر یک سوالی بود در خدمتم. استفاده در نمودارها در مثال زیر برای ساخت نمودارها از SVG استفاده […]
از ویژگی isolation برای ایزوله کردن یک گروه از عناصر در برابر آمیخته شدن با محتوای پشت سرشان استفاده می شود. معمولا از isolation در زمانی که از ویژگی mix-blend-mode استفاده می کنیم, بهره می بریم. فرض کنید یک متن در تگ <h1> را بخواهیم با محتوای پشت سرش ترکیب کنیم, ساختار بصورت زیر است: […]
از نوع داده ای <blend-mode> برای تعیین فرمول ترکیب کردن رنگ های یک عنصر با محتوای پشت سرش استفاده می شود. به بیان دیگر blend-mode دو پیکسل که روی هم قرار دارند را گرفته و برای نمایش, به روشی آنها را با هم ترکیب و یا یکی از آنها را انتخاب می کند. مثلا در […]
از ویژگی mix-blend-mode برای مشخص کردن حالت blend-mode در مورد آمیختن یک عنصر با محتوای پشت سر آن (backdrop) استفاده می شود. اول چند مفهوم را با استفاده از تصویر زیر بررسی می کنیم: source عنصر مورد نظر ما می باشد که می خواهیم ویژگی mix-blend-mode را بر روی آن اعمال کنیم. destination عنصر و […]
دنیای وب امروز سرشار از متحرک سازی های چشم نواز و شگفت انگیز است. امروزه توسعه دهندگان وب از روش های مختلف برای تشویق و سرگرم کردن و یا آگاهی دادن و هدایت کردن مخاطبینشان استفاده می کنند. و انیمیشن یکی از این ابزارها برای رساندن ما به این هدف می باشد. در این مطلب […]
از ویژگی display برای تعیین نوع چارچوب یک عنصر استفاده می شود. هر عنصری در صفحات وب یک مستطیل محسوب می شود و نوع چارچوب هر عنصر رفتار آن عنصر را در یک صفحه مشخص می کند. در CSS دو نوع چارچوب اصلی وجود دارند: inline و block. inline اگر عنصری دارای چارچوبی از […]
مدیریت فایل های پروژه و اینکه کدام فایل ها و فولدرها در دسترس باشند یکی از دغدغه های برنامه نویس ها می باشد. همینطور قطعا برای شما هم پیش آمده است که بر روی چندین پروژه بطور همزمان باید کار کنید و یا بنا بر موقعیت کاری شما شاید پروژهای زیادی مدام نیاز به یک […]
