وصف الموضوع

أساسيات التعامل مع css و إنشاء أوراق الأنماط ( مرجع لأكثر الخصائص انتشارا و القيم المحتملة لها )

الأوسمة :
101| CSS| html4| xhtml| أساسيات| دورة
في التصنيفات :CSS

إذا أردت أن تضع وصلة للموضوع في موقعك أو في منتدى يمكنك استخدام الوصلة التالية .

الشفرة :
<a href="http://qatardr.net/class/944" rel="bookmark" > دورة أساسيات css</a>

اضغطCtrl-C أو Apple-C  للنسخ

الوصلة ستظهر كالتالي :
دورة أساسيات css

هذا الموضوع مرخص وفق ترخيص Creative Commons.[ معلومات إضافية حول الترخيص بالعربية]

border-color

لون الإطار

border-color:green;

border-color:#c0c0c0;

القيم المتاحة:

• اسم اللون ( green, blue … الخ )
• رقم اللون بالنظام السادس عشر
• رقم اللون بصيغة RGB
• transparentشفاف

border-style

شكل الإطار

border-style:solid

border-style:dotted;

القيم المتاحة :

• خطوط مقطعة dashed
• dotted منقط
• double خط مزدوج
• groove خط اخدودي
• hidden مخفي
• inset نافر للخارج
• none بدون
• outset نافر للخارج
• ridge نافر
• solid صلب

Border-width

سمك الإطار .

boder-width:1px

border-width:value

القيم المتاحة :

• يمكن تحديد القيم بالبكسل أو بالقيمة التي تفضل أو
• استخدام
  • Thin : خط رفيع
  • Medium : خط متوسط
  • Thick : خط سميك .

Border

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

border:1px dotted blue ;

بحيث تحدد 3 عناصر اللون- السمك - النوع .

كل خط على حدى

يمكنك أن تحدد خواص كل خط من الإطار على حدى مثلا خط الإطار الأعلى أو خط الإطار الأسفل و هكذا .و كل خط له اسم

• border-top :الخط العلوي من الإطار
• border-bottom : الخط السفلي من الإطار .
• border-right : الخط الأيمن من الإطار .
• border-left : الخط الأيسر من الإطار.

مثلا :

border-top:1px solid black;

border-bottom:20px double #ccc;

أو يمكنك تحديد خاصية معينة لكل خط في الإطار

الإطار العلوي :

• border-top-color: لون الخط العلوي
• border-top-style: شكل الخط العلوي
• border-top-width:حجم الخط العلوي .

الإطار السفلي :

• border-bottom-color: اللون
• border-bottom-style: الشكل أو النوع
• border-bottom-width : حجم الخط

الإطار الايمن :

• border-right-color: اللون
• border-right-style: الشكل
• border-right-width: الحجم

الإطار الأيسر :

• border-left-color: اللون
• border-left-style: الشكل
• border-left-width: الحجم .

• اضيف  في 29 يناير 2008
• الزوار : [ 4,754 قارئ ]
• هذا الموضوع مرخص وفق ترخيص Creative Commons.[ معلومات إضافية حول الترخيص بالعربية]