بحث متقدم | التسجيل
الويب العربي
  تسجيل دخول
 
   
   

  ملاحظة
الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.




الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.

عـودة للخلف   الويب العربي سوق البرمجة والتصميم تبادل خبرات البرمجة

تبادل خبرات البرمجة تبادل الخبرات في جميع لغات البرمجة
Php , Asp , Ajax , Xml , Css , JavaScript ...etc

موضوع مغلق اضف موضوع جديد
 
خيارات الموضوع طريقة العرض
  #1  
قديم 28-07-2011, 11:17 AM
الفارس الجميل الفارس الجميل غير متصل
عضو
 
تاريخ التسجيل: Jul 2011
مشاركة: 66
مستوى تقييم العضوية: 13
الفارس الجميل is on a distinguished road
الافتراضي حيل سحرية فى CSS

بسم الله الرحمن الرحيم

في البداية أحب أن أقول أني لست محترفا بمجال CSS ولكني أجتهد، فهو مجال أحببته ولذلك أجتهد فيه بالقراءة والتطوير الذاتي من خلال الانترنت. ومع الأسف الشديد نحن نفتقر للمقالات العربية المميزة أو حتى البداية في كلتا الحالتين لا نجدها. طبعا لا يمكن أكتب هذه المقالة ولا أتعرض للعمالقة الموجودين على هذه المدونة فى هذا المجال لذلك أرجو النقاش لأنه سيزيد للكثيرين الكثير. هذه المقالة ليست منقولة من مكان معين ولكن تجميع لأكثر من مصدر في الشائع لهذه الطرائق.

أعتقد كغيري أن البداية الصحيحة مفيدة جدا، وطبعا CSS لغة تكويد معتمدة على الكتابة لذلك الكتابة السليمة تخرج نتيجة أفضل. إن شاء الله – في هذا المقالة سوف نتناول خمس طرائق لكتابة CSS أفضل، وأرحب للنقاش في هذا الموضوع فإذا لم أستطع الرد فغيري ربما يستطيع وتعم الفائدة – إن شاء الله.


خمس طرائق لكتابة CSS أفضل.


1- إعادة التصفير - Reset:


هذه الخطوة من أهم الخطوات في بداية الكتابة، لإعادة تصفير أغلب الخصائص لاختلاف المتصفحات هناك طريقتين مشهورتين يمكن استخدامهما دون الحاجة لكتابة طريقة خاصة بك.
Eric Meyer Reset
YUI Reset
كما يمكن كتابة طريقة لك على حسب احتياجاتك..# html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,# pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
ولكن لا تستخدم هذا الريست العام لأنه يستغرق وقت كثير في تنفيذه..
* { margin: 0; padding: 0; }


2- الترتيب اﻷبجدي:


div#header h1 {
z-index: 101;
color: #000;
position: relative;
line-height: 24px;
margin-right: 48px;
border-bottom: 1px solid #dedede;
font-size: 18px;
}
انظر بعد الترتيب الأبجدي أيهما أسهل في العثور على أي سطر..
div#header h1 {
border-bottom: 1px solid #dedede;
color: #000;
font-size: 18px;
line-height: 24px;
margin-right: 48px;
position: relative;
z-index: 101;
9. }
الترتيب الأبجدي سوف يساعدك في تقليل وقت البحث إذا أردت التعديل على أحد السطور، كما أنه في نظري يريح العين.


3- التنظيم:


من أهم أدوات التنظيم هو استخدام التعليقات عند كتابة الاكواد، ستظهر صفحة منظمة جدا بسهولة يمكنك الوصول إلى ما تريد.


/*****Reset*****/
Remove margin and padding from elements
هنا تعليق بداية إزاله الحشو والهوامش
/*****Basic Elements*****/
Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc.
الخطوط الأساسية للنص والفقرات
/*****Header*****/
Define all elements in the header
رأس الصفحة
/*****Content*****/


Define all elements in the content area
المحتويات
/*****Footer*****/
Define all elements in the footer
الذيل
وهكذا كإضافة بعد الاكواد الإضافية واستخدام الجافا اسكريبت.


4- الاتساق:


كمجمل لهذه النقطة العناصر المرتبطة ببعضها بعض من الأحسن أنها تكون متتالية الاكواد الخاصة بالمحتوى مع بعضها، كذلك رأس الصفحة وهكذا..
div#header { float: left; width: 100%; }
div#header div.column {
border-right: 1px solid #ccc;
float: right;
margin-right: 50px;
padding: 10px;
width: 300px;
}
div#header h1 { float: left; position: relative; width: 250px; }


5- ابدأ من المكان الصحيح:


أكثر من سايت قرأت فيه هذه الملحوظة (ابدأ من المكان الصحيح) يجب عليك الانتهاء أولا من بادية اكواد الهتميل وإتمام التجاتا الخاصة بالهتميل والانتهاء منها، ثم إضافة الاستايل بتدرج سيساعدك هذا كثير جدا في الانتهاء بالشكل المطلوب.


منتظر تعليقاتكم والمناقشة عليها.


للمزيد


http://o.ai/odn/community/212






التوقيع
نعم لتطبيق شرع الله فى مصر


شروحات مميزة وحلول مشاكل وبرامج وسكربتات متجدده هنا


http://o.ai/odn/community


http://o.ai/odn/share
موضوع مغلق



خيارات الموضوع
طريقة العرض

قوانين المشاركة
لا يمكنك إضافة موضوع جديد
لا يمكنك الرد على المواضيع
لا يمكنك إضافة مرفقات
لا يمكنك تعديل مشاركاتك

كود vB متاح
كود [IMG] متاح
كود HTML مغلق
إنتقل إلى

مواضيع مشابهة
الموضوع الكاتب القسم مشاركة آخر مشاركة
روعــــــ في عمل مؤثرات سحرية على الصورة ــــة joulail برامج الكمبيوتر 0 05-05-2009 09:31 PM
][ عروض دانا فور هوست][ عروض سحرية! يمكنك الدفع اسبوعي-شهري-3 اشهر 6 اشهر -سنوي dana4host عروض الاستضافة 0 09-10-2008 03:21 AM
هل تريد لمسات سحرية تفضل JAFAER أفراد يبحثون عن وظيفة 4 01-08-2007 02:47 AM


جميع الأوقات بتوقيت مكة المكرمة. الساعة الآن » 07:31 PM.

Powered by vBulletin
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.


 
 »  خدمات البرمجة   »  رئيسية الدليل
  »  خدمات التصميم   »  الأمن والحماية
  »  الدعاية والتسويق
  »  الدعم والتطوير
  »  الشركات الرسمية
  »  حجز دومينات
  »  خدمات الإستضافة
 
 
  »  مكتبة الإستايلات   »  رئيسية المكتبة
  »  أكواد برمجية   »  أدوات الويب ماسترز
  »  مكتبة الهاكات   »  أدوات المصممين
  »  سكربتات متنوعة
  »  مجلات إلكترونية
  »  بلوكات متنوعة
  »  ثيمات مختلفة
 
 

صحيفة متخصصة في متابعة أخبار وجديد الإنترنت العربي
والحوارات الصحفية ومعلومات تقنية متنوعة .

   
 
 

للتواصل مع فريق عمل الويب العربي
يمكنك ذالك من خلال مركز الدعم والمساندة.

 الدعم الفني |  اعتماد العضويات |  قوانين الإنتساب |  إتفاقية الإستخدام |  أهداف الويب العربي |  دليل الشركات |  مكتبة الويب |  صحيفة الويب العربي |  الرئيسية