استفاده از css sprite تعداد بازدیدvisits : 278
|
|||||||||
mehrad
![]() ![]() ![]()
|
استفاده از css sprite سلام
این قسمت مشکل بیشتر قالب های رزبلاگه Combine images using CSS sprites یا همان ( ترکیب تمامی تصاویر شما به یک تصویر) این خطا میگوید که چه دلیلی دارد که تمامی تصاویر شما باید از آدرس های مختلف بارگذاری شود ؟ آیا بهتر نیست که تمامی تصاویر را با هم ترکیب کنیم و با دانش css آن ها را در مکان های مناسب خود قرار دهیم ؟ اینطور باعث میشه که یک عدد عکس لود شود و حجم تصاویر انجمن کم شده و انجمن سریعتر بارگذاری شود. شما برای رفع این خطا بهتر است که از سایت زیر استفاده نمایید http://spriteme.org/ به سایت بالا رفته و عبارت SpriteMe را پیدا کنید . حالا روی اون کلیک کرده و به بوک مارک مرورگر خود بکشید و راها کنید اینطوری میتوانید به هر سایتی را که خواستید مراجع کنید و از محل بوک مارک ها روی SpriteMe کلیک کرده و منتظر دریافت تصاویر و کد های css بهینه بمانید .به عکس زیر توجه کنید .
منتظر میمانیم تا تمامی تصاویر Sprite شده و تبدیل به یک تصویر گردد سپس روی export css کلیک میکنیم تا css های رو ببینیم
حالا شما هم عکس را دارید و هم css ها رو . بعد از کلیک بر روی export صفحه ای مانند زیر را میبینید .
بعد از این مرحله باید لینک هایی که به شما میده با لینک های سایتتون جابجا کنید و یه تصویر کلی از بکگراند تصویرتون داشته باشید که در این صفحه به شما گفته شده که مثلا شما کد: .tp-loader.spinner0 { را در استایلتون پیدا کرده و به جای کد: background-image: url("../assets/loader.gif"); از این کد استفاده کنید کد: background-image: url("http://www.jaredhirsch.com/coolrunnings/public_images/068b455101/spriteme1.png");background-position: -2px -2px; |
||||||||
سه شنبه 12 اسفند 1393 - 14:19 |
|
![]() |
سپاس هاThanks (1) : smaeal - |
smaeal
![]() ![]() ![]()
|
پاسخAnswer 1 : استفاده از css sprite نیازی به این تاپیک نبود... چون خود gtmetrix اگه ارور css sprite رو داشته باشی عکس رو نشون میده... بعدش نیازی به اون سایت و ابزار نیست... خود محمد ابزارشو ساخته: |
||||||||
سه شنبه 12 اسفند 1393 - 14:25 |
|
![]() |
سپاس هاThanks (1) : mehrad - |