كيف تكتب لغة CSS وأكثر 5 أكواد شائعة فيها

كيف تكتب لغة CSS

هناك طريقتين لكتابة CSS

الطريقة الاولى

أن يتم تضمينها ضمن لغة HTML مباشرة
مثال هذا هذا كود رابط

<a style="width:100px; padding:5px 10px;" href="https://www.cnmu.info">كن مدون</a>

كما تلاحظ أكواد CSS تم تضمينها بداخل الكود style بين علامتين الإقتباس ""
وهذا يمكنك عمله مع أى عنصر من عناصر HTML أن تضيف لها كود style وتضمن فيه كما في المثال كل اكواد CSS الخاصة بالعنصر
لكن هذه الطريقة تناسب أكثر ان لم يكن سيتم استخدام اكواد css كثيرة لكن لو سيتم استخدام اكواد كثيرة ننتقل للطريقة الأخرى

الطريقة الثانية

هي أن تستخدم كلاس او معرف للعنصر
مثال نفس الكود السابق

<a class='cnmu' href="https://www.cnmu.info">كن مدون</a>

كما ترى تم اضافة كلاس له cnmu
وسيتم استخدام هذا الكلاس لكتابة نفس الاكواد css كالتالي

.cnmu {
width:100px;
padding:5px 10px;
}

والأكواد المضمنه بهذا الشكل تضاف فوق الوسم ]]></b:skin> في القالب
أو بين عنصرين <style> </style> يتم وضعه مثلاً فوق الوسم </head>

أكثر 5 أكواد شائعة

1- width
وهو الوسم الخاص بعرض العنصر
ويكتب كالتالي width:100px;
الرقم 100 يغير بأى رقم أكبر او اصغر
2-height
وهو الخاص بالإرتفاع
ويكتب كالتالي
height:100px;
نفس الشئ فيما يخص تغيير الرقم
3-padding
وهي مساحة الفراغ الداخلي للعنصر أو الحاشية
وتكتب كالتالي padding:10px 15px 6px 8px;
10 الفراغ من الاعلى
15 اليمين
6 الأسفل
8 اليسار
ويمكنك كتابتها كالتالي padding:10px;
معناه انه من كل الجوانب سيكون الفراغ 10 بيكسل
4-margin
نفس padding لكن هذه الحاشية الخارجية حول العنصر وبعده عن العناصر المجاورة له
وتكتب بنفس الطريقة
margin:10px 15px 6px 8px;
5-color
وهي الخاصة بلون النصوص في العناصر
وتكتب كالتالي
color:#000000;
تغير فقط #000000 بكود لون آخر
ويمكنك أن تضيف لها background
يصبح حبنها لون خلفية العنصر وليس النص هكذا
background-color:#000000;