سون لرن • آموزش

در این قسمت میخوام یک کد (Lazy loading SVG ) جالب رو در اختیارتون بذارم. دمو توضیحات مربوط به کد Lazy loading SVG همونطور که دیدید یک ایده زیبا برای لود شدن تصاویر قرار داده شده است و میتونین از اون در سایت خودتون استفاده کنید. همونطور که میبینید تا زمانی که تصویر اصلی لود … کدهای جذاب و دیدنی ( Lazy loading SVG ) : ایده جالب برای لود شدن تصاویر با SVG سون لرن • آموزش طراحی وب و جاوا اسکریپت ، HTML ، CSS و PHP ...

در این قسمت میخوام یک کد (Typographic Clock ) جالب رو در اختیارتون بذارم. توضیحات مربوط به کد Typographic Clock همونطور که دیدید یک ساعت جالب با استفاده از متن و تایپوگرافی ساخته شده است و میتونین از اون ایده بگیرید و در سایتتون استفاده کنید. برای اینکار از Flexbox و کلاسهای کاذب و ... استفاده شده است. برای مشاهده نحوه پیاده سازی این نمونه میتونین وارد بخش View Source بشید. بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین. موفق باشید. یا علی لینک دانلود Source ...

در این قسمت میخوام یک کد (SkiFree ) جالب رو در اختیارتون بزارم. دموتوضیحات مربوط به کد SkiFree همونطور که دیدید بازی ساده و جالب مرتبط با اسکی ساخته شده است و میتونین با استفاده از کلیدهای کیبورد اون رو هدایت کنید و امتی...

همونطور که اطلاع دارید در جلسه قبل در موردویژگی Pointer-events توضیحاتی رو قرار دادیم و مثالهایی رو زدیم تا شما رو با قابلیتهای اون آشنا کنیم. در این جلسه میخوایم کار با ویژگی های text-shadow و box-shadow و فیلتر drop-shadow و کاربردهای اونا رو به ش...

همونطور که اطلاع دارید در جلسه قبل در موردویژگی Shape-outside توضیحاتی رو قرار دادیم و مثالهایی رو زدیم تا شما رو با قابلیتهای اون آشنا کنیم. در این جلسه میخوایم کار با ویژگی pointer-events و کاربردهای اون رو به شما توضیح بدیم. مقدمات مربوط به Point...

در این قسمت میخوام یککد( Lonely Planet) جالب رو در اختیارتون بزارم. توضیحات مربوط Lonely Planet همونطور که دیدید یک سیاره بزرگ ثابت قرار داده شده و یک سیاره کوچک به دور اون میچرخه. زمانی که سیاره کوچک در پشت سیاره بزرگ قرار میگیره، سیاره بزرگ نارا...

همونطور که اطلاع دارید در جلسه قبل در موردویژگی Shape-outside توضیحاتی رو قرار دادیم و مثالهایی رو زدیم تا شما رو با قابلیتهای اون آشنا کنیم. در این جلسه میخوایم این موضوع رو ادامه بدیم و مثالهای بیشتری رو در اختیارتون قرار بدیم. مقادیر مجاز برای Shape-outside همونطور که دیدید با استفاده از این ویژگی میتونین روند و جریان قرارگیری متن در کنار یک تصویر یا المنت رو مشخص کنید. شما میتونین با استفاده از مقادیر مختلفی که برای این ویژگی وجود داره، یک شکل رو تعریف کنید و متون نیز به همون صورت قرار میگیرن. شما میتونین توابع زیر رو برای ویژگی shape-outside مورد استفاده قرار بدین: تابع circle() تابع ellipse() تابع polygon() استفاده از تابع circle این تابع ساده ترین مقدار مربوط به ویژگی shape-outside هس...

در این مطلب میخوامسایتیرو بهتون معرفی کنم که یک مرورگر بسیار زیبا و جالب رو بصورت رایگان در اختیارتون قرار میده که ظاهر و امکانات جالبی داره و میتونین از اون استفاده کنید. برای شروع وارد سایتOpera Neonبشین. توضیحات مربوط به مرورگر Opera Neon مرورگر Opera Neon یکی از محصولات Opera هست و میتونین اون رو بصورت رایگان برای سیستم عاملهای Mac و Windows دانلود کنید. این مرورگر ظاهر و چیدمان بسیار زیبا...

همونطور که اطلاع دارید در جلسه قبل در موردویژگی های با قابلیت انیمیشنی شدن و ویژگی table-layout توضیحاتی رو قرار دادیم و شما رو با اونا آشنا کردیم. در این جلسه میخوایم در مورد ویژگی Shape-outside توضیحات و مثالهایی رو قرار بدیم. همونطور که میدونین CSS از Box Model پیروی میکنه و به همین دلیل هست که همه المنتها بصورت مستطیلی نمایش داده میشن. حتی اگر از ویژگی های CSS مخصوص تغییر شکل مثل border-radiu...