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

[TARIMEHR]

سلام

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

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

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

http://up.sabapatogh.com/images/51293749940099747066.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>

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

[nginxweb]

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

Spritebox - Create CSS from Sprite Images (http://www.spritebox.net/)

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

[TARIMEHR]

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

[EXXXIR]

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

[TARIMEHR]

هنترز | هاست , دامنه , طراحی سایت , هاستینگ , سرور مجازی , سرور اختصاصی هاست و دامنه, هاست ایران (http://henterz.com)

[EXXXIR]

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

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

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

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

[TARIMEHR]

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

[EXXXIR]

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

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

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

[TARIMEHR]

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

[ipsat]

#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 تغییر نام داده و روی فایل قبلی جایگزین کنید.