در این آموزش به روش‌های تعیین‌اندازه‌ی canvas، تعامل با CSS و مشکلات مربوط به آن در حالت‌های مختلف می‌پردازیم.
اشکال بیضی شکل انعطاف پذیر
در این مطلب با نحوه ساخت اشکال بیضی شکل آشنا می شویم
حاشیه های تصویری پیوسته
صورت مسئله همانطور که گاهی طرح هایی برای پس زمینه ها در نظر می گیریم. برخی موارد نیاز است تا چنین طرح هایی را در قسمت حاشیه داشته باشیم. شاید جواب بدهید, کار ساده ای است می توانیم از border-image استفاده کنیم.
طرح های کاتوره ای در پس زمینه
صورت مسئله طرح های تکرارپذیر هندسی قشنگ و خوب هستند اما می توانند کمی خسته کننده باشند. در طبیعت هم, خیلی کم پیش می آید تا الگوهای کاملا همسان داشته باشیم. حتی در موارد تکراری نیز, کمی تفاوت و غیر یکسانی و یا همان رفتارهای تصادفی یا کاتوره ای وجود دارد.
ساخت طرح های پیچیده در پس زمینه
صورت مسئله در مطلب قبلی نحوه ساخت طرح های راه راه را بررسی کردیم. اما اینگونه طرح ها تنها نقش و نگاری که می توانند در طراحی مورد استفاده قرار بگیرند نیستند و طرح های هندسی و انواع دیگری هم از قبیل شبکه ای, پولکا یا همان خال خال و یا طرح های شطرنجی هم […]
مردم من
در این مطلب قصد معرفی یک دمو برای پخش آهنگ مردم توسط استاد معین را داریم. طرح آسمان از این دمو گرفته شده و با استفاده از Canvas دوباره سازی شده است. همینطور طرح پخش کننده موسیقی از این دمو گرفته شده و بصورت واکنشگرا دوباره سازی شده است و قابلیت نمایش نوار پیشرفت نیز […]
استایل دهی به متن جایگزین تصویر
همانطور که می دانید نوشته جایگزین یک تصویر در صفحات وب بوسیله خاصیت alt در تگ <img> به وجود می آید. <img src=”bird.jpg” alt=”تصویر یک پرنده خیلی خشنگ” /> ما به دلایل زیر از این ویژگی استفاده می کنیم: در صورت بروز هر مشکل برای تصویر کاربر می تواند این متن را ببیند و شاید […]
active:
active: یک pseudo-class می باشد که با استفاده از آن می توان در CSS حالت فعال (active) یک عنصر را انتخاب, و بر روی آن عنصر در حالت فعالش استایل خاصی اعمال کرد. active: یک عنصر را از زمان کلیک شدن تا زمان رها شدن مورد هدف قرار می دهد. استایل دهی یک عنصر در […]
چک باکس های باور نکردنی
در اینجا قصد نمایش چند دمو که ظاهر یک چک باکس به طور خلاقانه در آنها تغییر یافته است را داریم. اگر با ساخت همچین چک باکس هایی در css آشنایی ندارید به این مطلب برای یادگیری مراجعه کنید. See the Pen Toggle Rebound by Mojtaba Seyedi (@seyedi) on CodePen. See the […]
تغییر ظاهر چک باکس با CSS
در این ترفند می خواهیم تبدیل کردن عناصر چک باکس را به عناصر گرافیکی جالب آموزش دهیم و یک دمو را قدم به قدم با هم بررسی کنیم. فرمول اصلی قضیه از این قرار است که ما قصد مخفی کردن عنصر input را داریم و می خواهیم استایل دلخواه را بر روی label متصل به […]