Blood

تکنیک CSS Sprite

12 پست در این موضوع قرار دارد

با سلام

میخواستم از استادید بپرسم آیا برای استفاده از تکنیک CSS Sprite میشه تمام عکس های صفحه اول رو داخل یک عکس قرار داد؟

میخواست بپرسم که دیر لود نمیشه؟ یعنی کل عکس هار بزارم یا چندتا چندتا قرار بدم ؟

1

به اشتراک گذاری این پست


لینک به پست

یکی از مزیت های اسپریت هم اینه که سرعت لود و تعداد درخواست رو کاهش میده

اگر عکس ها خیلی زیاده به چند تا اسپریت مختلف تقسیم کنید و اگر کمه همون یه اسپریت کافیه

معمولا نزارید انقدری زیاد بشه که هر عکس اسپریت بیشتر از 50 یا 60 کیلوبایت باشه

البته راه های خیلی زیادی هست برای کاهش حجم که میتونید استفاده کنید

7

به اشتراک گذاری این پست


لینک به پست

توی تکنیک

CSS Sprite عکس هایی که تکرار میشن رو نمیشه استفاده کرد (اگر پشت زمینه سایتتون عکس هست اون رو رها کنید) مابقی عکس ها میشه (حالا بستگی به کدنویسی داره سخت و آسون میشه درست کرد)

6

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

یکی از مزیت های اسپریت هم اینه که سرعت لود و تعداد درخواست رو کاهش میده

اگر عکس ها خیلی زیاده به چند تا اسپریت مختلف تقسیم کنید و اگر کمه همون یه اسپریت کافیه

معمولا نزارید انقدری زیاد بشه که هر عکس اسپریت بیشتر از 50 یا 60 کیلوبایت باشه

البته راه های خیلی زیادی هست برای کاهش حجم که میتونید استفاده کنید

ممنون میشه یه چند تا راه نام ببرید ؟

به غیر از

PNGGauntlet

و افزونه SMUCH

من عکس های سایتم بیشترش .PNG هست به نظر شما خوبه این پسوند ؟

تعداد عکس های سایتم که تکرار نمیشن

57 تا هستش

حجمش با فشرده سازی شده 203 کیلوبایت به نظر شما 2 قسمت کنم؟

توی تکنیک

CSS Sprite عکس هایی که تکرار میشن رو نمیشه استفاده کرد (اگر پشت زمینه سایتتون عکس هست اون رو رها کنید) مابقی عکس ها میشه (حالا بستگی به کدنویسی داره سخت و آسون میشه درست کرد)

منظورتون از تکرار شدن یعنی بک گراندها هستش یا ؟؟؟؟ عکس هایی که در صفحات دیگر سایت چند بار ازش استفاده شده؟ منظورتون هست؟؟

ویرایش شده در توسط M.At
0

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

میخواستم ببینم به این صورت هستش؟


.Sp-ImageAll-2{background:url(images/ImageAll-2.png) no-repeat;}
.Sp-ImageAll-2.home{background-position:-83px -2px; width:23px; height:23px;}

باید از منفی استفاده بشه؟ تو پوزیشن؟

برای نمایش هم به این صورت استفاده کردم؟


<div class="Sp-ImageAll-2.home"></div>

اما نمایش نمیده؟

ویرایش شده در توسط M.At
0

به اشتراک گذاری این پست


لینک به پست

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

https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#sourceid=chrome-psyapi2&ie=UTF-8&q=css%20sprite%20generator

3

به اشتراک گذاری این پست


لینک به پست

ممنون میشه یه چند تا راه نام ببرید ؟

به غیر از

PNGGauntlet

و افزونه SMUCH

من عکس های سایتم بیشترش .PNG هست به نظر شما خوبه این پسوند ؟

تعداد عکس های سایتم که تکرار نمیشن

57 تا هستش

حجمش با فشرده سازی شده 203 کیلوبایت به نظر شما 2 قسمت کنم؟

منظورتون از تکرار شدن یعنی بک گراندها هستش یا ؟؟؟؟ عکس هایی که در صفحات دیگر سایت چند بار ازش استفاده شده؟ منظورتون هست؟؟

منظورم عکس هایی هستن که repeat میشن توسط css (وگرنه همه عکس های قالب در صفحات دیگه استفاده میشه)

1

به اشتراک گذاری این پست


لینک به پست

منظورم عکس هایی هستن که repeat میشن توسط css (وگرنه همه عکس های قالب در صفحات دیگه استفاده میشه)

یعنی اگر بخوام بک گراند یک div رو یک عکس کوجیک قرار بدم و اون رو تکرار کنم در داخل اون div نمیشه از این خاصیت استفاده کنم؟

0

به اشتراک گذاری این پست


لینک به پست

دوستان لطفا اطلاعات اشتباه ندید

هیچ فرقی نداره و میتونید عکس های تکرار شونده رو هم استفاده کنید با خاصیت :


background-repeat : ...

ممنون میشه یه چند تا راه نام ببرید ؟

به غیر از

PNGGauntlet

و افزونه SMUCH

من عکس های سایتم بیشترش .PNG هست به نظر شما خوبه این پسوند ؟

تعداد عکس های سایتم که تکرار نمیشن

57 تا هستش

حجمش با فشرده سازی شده 203 کیلوبایت به نظر شما 2 قسمت کنم؟

برنامه های گرافیکی مثل فتوشاپ خروجی مخصوص وب سایت دارن

1

به اشتراک گذاری این پست


لینک به پست

دوستان لطفا اطلاعات اشتباه ندید

هیچ فرقی نداره و میتونید عکس های تکرار شونده رو هم استفاده کنید با خاصیت :


background-repeat : ...

برنامه های گرافیکی مثل فتوشاپ خروجی مخصوص وب سایت دارن

بنده بر اساس تجربه شخصی گفتم ...

یعنی اگر بخوام بک گراند یک div رو یک عکس کوجیک قرار بدم و اون رو تکرار کنم در داخل اون div نمیشه از این خاصیت استفاده کنم؟

باید اون عکس پشت زمینه رو با دیگر عکس ها ترکیب نکنی و جداگانه بذارید

0

به اشتراک گذاری این پست


لینک به پست

اسپرایت عیبی که داره اینکه تو حالت واکنش گرایی مشکل ایجاد میکنه چون که یک حالت ثابتی داره .

به نظر من اگه از اسپرایت به عنوان ایکون استفاده میکنید از فونت ایکون های SVG استفاده کنید خیلی خیلی بهتره .

1

به اشتراک گذاری این پست


لینک به پست

ممنون میشه یه چند تا راه نام ببرید ؟

به غیر از

PNGGauntlet

و افزونه SMUCH

من عکس های سایتم بیشترش .PNG هست به نظر شما خوبه این پسوند ؟

تعداد عکس های سایتم که تکرار نمیشن

57 تا هستش

حجمش با فشرده سازی شده 203 کیلوبایت به نظر شما 2 قسمت کنم؟

https://tinypng.com

1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری