استفاده از css برای قرار دادن عکس در html

سلام

اگر با gtmetrix کار کرده باشید، بخشی داره بنام Combine images using CSS sprites

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

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

http://up.sabapatogh.com/images/5129...0099747066.jpg
تصویر رو مشاهده کنید

الان برای پلن A که از css استفاده کردیم عکس به >>بالا، گوشه ی راست کشیده شده
در صورتی که باقی عکس از بالا و از طرفین دقیقا در وسط قرار دارن

کد css ساده ای که براش استفاده شد به صورت زیر هست

کد:

---

#gtuse{background:url(http://henterz.com/images/hosting/panel1.png) no-repeat ;float:center;margin-left:25px;;width:55px;height:27px;padding-top:45px

---

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

کد:

---

      <h6 > <a id="gtuse" class="hideTxt" ></a> </h6>

---

یه خواهشی دارم که لطفا درخواست ارسال دسترسی نداشته باشید
پیشاپیش تشکر

دوست گرامی اگر هدفتون ساخن Sprite اصولی و راحت می باشد به سایت زیر مراجعه بفرمایید:

Spritebox - Create CSS from Sprite Images

با دادن عکس براحتی کدهای sprite css تحویل شما داده می شود که با اکثر browser ها نیز سازگاری خواهد داشت

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

آدرس همين صفحه كه مشكل داريد لينك بديد تا راهنماييتون كنم.

هنترز | هاست , دامنه , طراحی سایت , هاستینگ , سرور مجازی , سرور اختصاصی هاست و دامنه, هاست ایران

الان مشكل اينجاست شما يا بايد همه عنوان هاي جدول img‌ استفاده كنيد يا همه تبديل به div ‌كنيد بعد تنظيم ارتفاع انجام بديد.

الان اگر من براي دايو به شما راهنمايي كنم بقيه بهم ميريزه پس همه كدهارو اول يكسان كنيد.

در ضمن اگر هدف css

sprites

هست بايد بگم شما الان در حقيقت هيچ كار مثبتي انجام نداديد هدف اين بايد باشه كه همه تصاوير در يك تصوير ذخيره بشن و با Css‌ ازهم جدا كنيد كه سرعت لود و فشاركمتري روي سرور بياد

اما با اين كاري كه شما انجام داديد همون تك تصوير بگراند div‌ كرديد كه فرقي در نتيجه نخواهد داشت.

اونطوری که شما میفرمایید باید کل نوشته ها هم داخل عکس بره
ولی میخوام قابلیت تغییر پلن ها رو داشته باشم

نقل قول:

---

نوشته اصلی توسط TARIMEHR

اونطوری که شما میفرمایید باید کل نوشته ها هم داخل عکس بره
ولی میخوام قابلیت تغییر پلن ها رو داشته باشم

---

اگر هدف سرعت هست بله بايد تصاوير ثابت در يك تصوير ادغام شوند (حداقل مواردي كه فكر ميكنيد تغيير نميكنند)

اما اگر سرعت مد نظر نيست كه همون تك تك باشن عكسا براي ويرايش قطعا راحتتريد.

موضوع سرعتش نیست
چون کلا 100 کیلوبایت هم نمیشه
حجم صفحه اصلی 700 هست که میانبر زیرش ، حجمش بالاست. 500 کیلوبایت

کد:

---

#gtuse {
    background: url("http://henterz.com/images/hosting/panel1.png") no-repeat scroll 0 0 transparent;
    height: 57px;
    margin: 0 50px;
    width: 55px;
}

---

http://upload7.ir/images/53908324091630826953.png
کد بالا با کد قبلی جایگزین و همچنین فایل بالا گرفته به panel1.png تغییر نام داده و روی فایل قبلی جایگزین کنید.