وصف الموضوع

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

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

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

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

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

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

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

Classes

هي تعار يف تحددها أنت لإعطائها خصائص مختلفة ..!! مثلا نحن في المثال السابق اعطينا محتويات الوسم p الحجم 15

p{
font-size:15px;
}

و بالتالي فقرة مثل هذه

هذه فقرة عادية

هذه فقرة غير عادية و مميزة

وفقا للقاعدة التي وضعناها فحجم الخط سيكون 15 لكن نحن نريد للفقرة الثانية أن تظهر بشكل محتلف .. مثلا لونها أحمر و حجم الخط 20 و بخط غامق

و بالتالي سنحدد نمط خاص class

اسم الكلاس يبدأ بنقطة متبوع باسم انت تحدده ليعبر عن ما تريد سنسميه featuredtext مع ملاحظة أن لا يبدأ اسم Class برقم لان ذلك لن يعمل مع بعض المتصفحات

.featuredtext{
font-size: 20px;
color: red;
font-weight: bold;
}

و في شفرة الhtml

هذه فقرة عادية
<p class="featuredtext">هذه فقرة غير عادية و مميزة</p>

ليظهر بالشكل التالي

هذه فقرة عادية

هذه فقرة غير عادية و مميزة

ID

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

مثلا

<p  id="container"> نص عادي. </p>

و شفرة الCss

#container{
width: 555px;
padding: 15px;
border: 10px solid #f45454;
background: #ffffff;
}

كما يمكن استخدام الطريقة التالية

p#mypara
{
text-align: right;
color: green;
font-size:2em;
}

السابق سينطبق على كل p فقرة تحمل id = mypara

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