المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : سلسلة دروس نصائح: نظف اكواداك واختصرها بنفسك



romaissa
10-30-2013, بتوقيت غرينيتش 08:49 PM
http://www.dzbatna.com/images/icons/idea.gif ط³ظ„ط³ظ„ط© ط¯ط±ظˆط³ ظ†طµط§ط¦ط*: ظ†ط¸ظپ ط§ظƒظˆط§ط¯ط§ظƒ ظˆط§ط®طھطµط±ظ‡ط§ ط¨ظ†ظپط³ظƒ (http://www.dzbatna.com/t2061376/)



السلام عليكم ورحمة الله وبركاته
نعود ان شاء الله بسلسلة دروس مستفادة من لغة css هيا عبارة عن نصائح مستفادة من خلال تجربتي مع css نصائح وطرق يجب عليك ان تعرفها لتحسن كتابتك في css ولتزيد من الفاعلية في الكتابة

ولتزيد من السرعة في التحميل وتساعد المتصفح على ترجمة الاوامر بشكل اسرع وايضا لاننسى الصورة الجمالية في نظيم الاوامر
---------------------------
اليوم نقدم عدة قواعد تساعدك ع اختصار الوقت والجهد والابتعاد عن مايسمى منظف الكود code او اختصار الاكواد تعلم بنفسك ان تختصر كل اكوادك وتساعد ع تسريعها




اولاً: اكتب خصائص الخلفية في سطر واحد 'Background'
------------------------------------------------------------------------------------------
الكثير منا يكتبون اكواد الخلفية في عدة سطور ودا غلط كبير جدا
ببساطة جدا
بدل ماتتعب نفسك وتكتب

رمز Code:
background: url(image.gif); background-color: #eaeaea ; background-repeat: repeat-x; background-position: top left;
اسهل وارقى واحلى

رمز Code:
background: #eaeaea url(example.gif) repeat-x top left;
ليست بالشئ المعقد

------------------------------------------------------------------------------------------




ثانيا: نفس الكلام بالنسبة لخاصية 'Border'
------------------------------------------------------------------------------------------

حتى انتا نفسك تلاحظ في نسخ الفي بي مكتوبة بشكل سطر واحد في متغيرات css

رمز Code:
border-color: red; border-width: 1px; border-style: solid;
بهذا الشكل

رمز Code:
border: 1px solid red;
ببساطة برضوا

------------------------------------------------------------------------------------------




ثالثاً: خصائص القوائم 'List properties'
------------------------------------------------------------------------------------------

رمز Code:
list-style-position: outside; list-style-image: none; list-style-type: disc;
لتكون بهذا الشكل

رمز Code:
list-style: disc outside;
------------------------------------------------------------------------------------------


رابعاً: خصائص الخطوط
------------------------------------------------------------------------------------------

Font and line-height properties

رمز Code:
font-family: Arial, Helvetica; font-weight: bold; font-style: italic; font-size: 1em; line-height: 1.5em;
لتكون

رمز Code:
font: bold italic 1em/1.5em Arial, Helvetica;
------------------------------------------------------------------------------------------


خامساً: خصائص
------------------------------------------------------------------------------------------

Margin and padding

رمز Code:
margin-top:10px; margin-right:10px; margin-bottom:10px; margin-left:10px;
رمز Code:
margin: 10px 10px 10px 10px;
------------------------------------------------------------------------------------------




سادساً: قم بالتمرين الدائم ع اكواد cssالتى تستخدمها
------------------------------------------------------------------------------------------

مش شرط انك اثناء العمل فقط تقوم بالكتابة لكن انا دائما باكتب الاساس بورقة وقلم دايما معايا







--------+++---------
اخيراً

إفحص + أفحص + إفحص

--------+++---------


by Kamandaya1 (http://www.dzbatna.com/u46056/)








ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)



https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى