الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

توزيع الصور المقطعة في الصفحة مشكلة المسافات

بدأه الاناكوندا في 19 أبريل 2012 · 1 رد · 611 مشاهدة · في ASP.NET
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

السلام عليكم ورحمة الله وبركاته .

اخواني الكرام .. عملت صفحة واريد ان اعملها ماستر بيج .

وصممت تصميم بالفوتوشوب وقطعته إلى هيدر واسفل الهيدر اربع قطع لصور وفوتر.

هيدر

صورة ، صورة ، صورة ، صورة.

فوتر

وعملت . بالصفحة div من خانة واحدة ووضعت الهيدر كل شيء تمام .

واسفل الدف عملت div وادرجت به جدول من أربع خانات .

وداخل الجدول عملت لكل خانة في الجدول div وادرجت الصور الاربعه بداخلها .

ولكن المشكلة . تأتي مسافات بيضاء بين الصور .

رغم ان مقاس الصورة من طول وعرض ادخله بخانة خصائص الـ div ثم ادرج الصورة واعدل بكودها لعرضها وطولها .

ولكن المسافات مازالت . وهذا الكود الذي عملته ياليت احد يخبرنا شلون تنضم الصور المقطعة على بعض ونتخلص من المسافات .

الكود الجدول وبداخله الـ div ومسار الصور .

 <table class="style1" align="center">
                <tr>
                    <td class="style4">
                         <div style="width: 44px">
                             <img src="jmeg/moh_02.gif" width="44" height="47" /></div>
                        </td>
                    <td class="style3">
                        <div style="width: 513px">
                           <img src="jmeg/moh_03.gif" align="left" 
                                style="width: 513px" /></div>
                    </td>
                    <td class="style5">
                       <div style="width: 37px">
                            <img  src="jmeg/moh_04.gif" height="47" alt= align="right" 
                                style="width: 37px" /></div>
                    </td>
                    <td class="style2">
                             <div style="width: 183px">
                                 <img  src="jmeg/moh_05.gif" height="47" align="right" 
                                     style="width: 183px" dir="rtl" /></div>
                        </td>
                </tr>
            </table>
        </div>
 </table>

بنتظاركم

#2

السلام عليكم :)

أعتقد أن في الفوتوشوب ما تزال أداة التقطيع الفوري موجودة حتى في الإصدارات الجديدة.. أذكر كان اسمها Slice Tool

فكرتها مثل حدود المسطرة، حيث يعتبر كل تقاطع ركن لصورة وكل مستطيل أو مربع صورة مستقلة مستقبلية..

ونخرجها عن طريق حفظ الصورة كصفحة إنترنت (alt+shift+ctrl+s) (أو من قائمة File ثم Save for Web) سيقوم تلقائياً بإنشاء جدول مرتب بالصور المقطعة مباشرة وبدون مسافات أو تعب..

وسيقوم كذلك بعرص الوسوم المستخدمة في إنشاء الجدول مباشرة في الصفحة نفسها..

شيء رائع ويختصر الوقت من البداية!

كما أعتقد أنه يمكن حل مشكلة الهوامش بين الصور عن طريق تنسيقات Css بجعل وسم الصورة img دائماً بدون هوامش margin: 0px

كما في الكود التالي:

img {
     margin: 0px;
}

وكذلك بالنسبة لخلايا الجدول كلها نقوم بإزالة الهوامش الداخلية Paddings والهوامش الخارجية Margins!

td {
     margin: 0px;
     padding: 0px;
}

كما أعتقد أنه ليس ضرورياً أن تستخدم القطاعات Divs بداخل الجدول!!

حسناً إذن

والسلام عليكم ورحمة الله وبركاته :)

تم تعديل هذه المشاركة بواسطة AmeenSnw في 25 أبريل 2012 في 18:26

مواضيع مشابهة

عدد الزوار حالياً

المتواجدون خلال آخر دقيقتين · يتحدّث كل ٣٠ ثانية

—الإجمالي—أعضاء مسجّلون—زوار بدون تسجيل

جارٍ التحقق من المتواجدين…