100% , ماذا , منتدى , أكثر , الله , المنتدى , الصحيح , الو , الطريق , اخطاء , اكثر , برنامج , جداً , عبارات

حل مشاكل توافق الستايل

هذا الموضوع يحتاج لعدة مواضيع لأتمكن من التعقيب على جميع النقاط المؤديه الى ستايل خالي من الاخطاء 100%
ولكن سأذكر أهم اسباب فشل توافق الستايل وكذلك طرق حلها قدر الامكان
سؤال : لماذا عندما انتهي من تصميم ستايل بالفوتوشوب يظهر لدي اخطاء عديدة ؟
الجواب : اصدار برنامج الفوتوشوب يلعب دورا ً كبيرا ً في وجود مثل هذة الاخطاء لاسيما القديمه منها .
اما عن الاصدارات الجديدة فهي تمثل نسبة اخطاء اقل ( على حد علمي والله اعلم )
ولكن يمكن ان نتأكد من اخطاء الاكواد المأخوذه من برنامج الفوتوشوب وذلك بعد الفحص في موقع فحص الستايل .
The W3C Markup Validation Service
تتركز اخطاء الستايل في قوالب معينه منها :
header
navbar
forumhome وتوابعه ..
forumdisplay
footer
ايضا اذا كان الـ postbit أو الـ postbit_legacy مصمم بالفوتوشوب .
عند الانتهى من تصميم الستايل وتركيبه تأكد من عدم وجود العبارات التالية داخل الاكواد :
سنبدأ الحديث عن وسم table :
اذا رأيت مثل هذة العبارات قم بحذفها [ لن يأثر ذلك على عمل الجدول ]

HTML & CSS

 dir="rtl" 

  

أو

HTML & CSS

 id="table 

  

ايضا يمنع استخدام الاضافات التاليه داخل وسم table :
صورة خلفية

HTML & CSS

 background 

  

أو لون الخلفية

HTML & CSS

 bgcolor 

  

الصحيح هو استخدام خاصية style وهي بهذا الشكل :
اذا ارت وضع صورة خلفية

HTML & CSS

 <table style="background-image:url('xxx.gif')"> 

  

اما اذا اردت وضع لون للخلفية :

HTML & CSS

 <table style="background-color:#FF3300"> 

  

أو استخدام خصائص CSS بدل من ذلك
=================
وسم tr
ليس لهذا الوسم أي اضافات .
=================
وسم td
نفس الاجراءات في وسم table
=================
وسم الرابط a herf يضاف بهذا الشكل :

HTML & CSS

 <a href="http://www.xxx.com">شبكة المطور</a> 

  

ويمكن اضافة خاصيتين وهي الاكثر شيوعا واستخداما ً
وهي خاصية الوصف

HTML & CSS

 title="اكتب الوصف عن مرور المؤشر" 

  

وخاصية فتح الرابط في صفحة مستلقة

HTML & CSS

 <a href="http://www.xxx.com" target="_blank">شبكة المطور</a> 

  

وسم الصورة img [ مهم جدا ] وأكثر الاخطاء تواجداً
الوسم الصحيح لكود الصورة هو :

HTML & CSS

 <img src="http://www.xxx.com/xxx.gif" alt="الوصف ويمكن تركه فارغ" border="0" /> 

  

لابد من كتابة بهذة الطريقة بجميع الخصائص حتى ولم تستخدم مثل خانة الوصف وحدود الصورة
ويمكن ترك خانه الوصف فارغه وايضا وضع الرقم 0 في حدود الصورة .
مسافة سطر <br> هذا الامر كثير ما اشاهده في المنتديات وهذا خطأ
والصحيح هو :

HTML & CSS

 <br /> 

  

يفضل عدم استخدام الكود <center>
والصحيح هو :

HTML & CSS

 <div align="center"></div>

أو

<p align="center"></p> 

  

ويوضع الامر او الرابط قبل كود الاغلاق :

HTML & CSS

 </div> 

  

يفضل عدم استخدام الكود التالي داخل القوالب :

HTML & CSS

 <style type="text/css"></style> 

  

الصحيح وضع متغيرات الكلاس في CSS الاضافي
كود الصورة الصحيح
دائما ما اشاهد خطاءً متكررا ً في الكثير من المنتديات في عملية وضع كود الصورة الصحيح
اليكم الكود الصحيح :

HTML & CSS

 <img border="0" src="رابط الصورة" alt="وصف الصورة" /> 

  

يمكن ترك وصف الصورة فارغ فهذا لا يؤثر على الكود مثال :

HTML & CSS

 <img border="0" src="رابط الصورة" alt="" /> 

  

ولكن لابد من كتابة كود الوصف داخل كود الصورة
هذي بعض الملاحظات الاكثر استخداما ً ، وارجو ان اكون قد استفدتم منها
وأي استفسارات انا حاضر للرد

رشيد برادة معجب بهذا

المصدر: القلم الذهبي - من قسم: «۩۞۩-منتدى البرمجة وتطوير المواقع-۩۞۩»

---

pg lah;g j,htr hgsjhdg 100% lh`h lkj]n H;ev hggi hglkj]n hgwpdp hg, hg'vdr ho'hx h;ev fvkhl[ []hW ufhvhj

   

تواصل معي عبر facebook تواصل معي عبر twitter تواصل معي عبر youtube تواصل معي عبر google

جزاك الله الفردوس الأعلى من الجنــــــــــان
لروعة طرحك القيم والمفيد
لـ عطرك الفواح في ارجاء المنتدى كل الأمتنان
أتمنى أن لاننــحرم طلتك البهية
لكم أجمل التحايا و أعذب الأمنيات
دمتم بطاعة الله

   

مشكوووووور والله يعطيك الف عافيه