Web
	Analytics
الدرس 6: متغيرات الوسوم

css6
 
قد مر معنا أن هناك اختلافا بين أسماء المتغيرات في لغة CSS وأسماء المتغيرات في لغة HTML فإذا كان حجم الخط في وسوم HTML يرمز له بـ (size) فإننا نرمز له بـ (font-size) في لغة CSS، لهذا وكما وعدتك سنتعرف في هذه الفقرة على متغيرات أهم الوسوم التي رأيناها في دروس لغة HTML.

 (هذه الجداول ليست للحفظ ! احتفظ بها كمرجع فقط بعد أن تطلع عليها وتجرب بعضها بنفسك )

 


الوسم <body>

المتغير

الوصف

font-family

 يحدد هذا المتغير نوع الخط المستخدم.

font-size

يحدد هذا المتغير حجم الخط المستخدم.

color

يحدد هذا المتغير لون الخط المستخدم.

background-color

يحدد هذا المتغير لون الخلفية.

background-image

يحدد هذا المتغير إحدى الصور كخلفية للصفحة.

background-repeat

يحدد هذا المتغير كيفية تكرار الصورة الخلفية ويأخد إحدى القيم التالية:
(repeat, repeat-x, repeat-y, no-repeat)

scrollbar-base-color

يحدد هذا المتغير لون القاعدة لأشرطة التمرير الطولية والعرضية.

scrollbar-arrow-color

يحدد هذا المتغير لون السهم لأشرطة التمرير الطولية والعرضية.

scrollbar-track-color

يحدد هذا المتغير لون الخلفية لأشرطة التمرير الطولية والعرضية.

scrollbar-face-color

يحدد هذا المتغير لون الواجهة لأشرطة التمرير الطولية والعرضية.

scrollbar-highlight-color

يعطينا هذا المتغير بعض الإضاءة على أشرطة التمرير (بحسب اللون المستخدم).

scrollbar-3dlight-color

يعطينا هذا المتغير التأثير الثلاثي على أشرطة التمرير.

scrollbar-darkshadow-color

يحدد هذا المتغير لون الظل لأشرطة التمرير الطولية والعرضية.

scrollbar-shadow-color

يحدد هذا المتغير لون الظل لأشرطة التمرير الطولية والعرضية (يختلف قليلا عن المتغير السابق).

 


الوسم <table>

المتغير

الوصف

font-family

 يحدد هذا المتغير نوع الخط المستخدم داخل الجدول.

font-size

يحدد هذا المتغير حجم الخط المستخدم داخل الجدول.

color

يحدد هذا المتغير لون الخط المستخدم داخل الجدول.

background-color

يحدد هذا المتغير لون خلفية الجدول.

background-image

يحدد هذا المتغير إحدى الصور كخلفية للجدول.

border-color

يحدد هذا المتغير لون الإطار (الحدود الأربعة).

border-width

يحدد هذا المتغير سمك الإطار (الحدود الأربعة) ،قد يأخذ القيم التالية:

(thick, رقم, thin, medium)

border-style

 يحدد هذا المتغير شكل الإطار (الحدود الأربعة)، قد يأخذ القيم التالية:

(none, hidden, dotted, dashed, solid, double..)

border-left-color

يحدد هذا المتغير لون الحد الأيسر للإطار.

border-left-width

يحدد هذا المتغير سمك الحد الأيسر للإطار.

border-right-color

يحدد هذا المتغير لون الحد الأيمن للإطار.

border-right-width

يحدد هذا المتغير سمك الحد الأيمن للإطار.

border-top-color

يحدد هذا المتغير لون الحد العلوي للإطار.

border-top-width

يحدد هذا المتغير سمك الحد العلوي للإطار.

border-bottom-color

يحدد هذا المتغير لون الحد الأسفل للإطار.

border-bottom-width

يحدد هذا المتغير سمك الحد الأسفل للإطار.

 


الوسمين <ul> و <ol>

المتغير

الوصف

font-family

 يحدد هذا المتغير نوع الخط المستخدم في القوائم.

font-size

يحدد هذا المتغير حجم الخط المستخدم في القوائم.

color

يحدد هذا المتغير لون الخط المستخدم في القوائم.

list-style-image

يحدد هذا المتغير صورة معينة كمحدد للقائمة (يأخذ مسار الصورة كقيمة له).

list-style-position

يحدد هذا المتغير مكانا محددا لقوائم، يأخذ القيمتين:

(Inside, Outside)

list-style-type

يحدد هذا المتغير شكل محدد القوائم، يأخذ هذه القيم:

(none, disc, circle, square, decimal, lower-alpha...)

 


الوسم <input>

المتغير

الوصف

font-family

 يحدد هذا المتغير نوع الخط المستخدم في عناصر النماذج (مربع النص، زر الخيار).

font-size

يحدد هذا المتغير حجم الخط المستخدم في  عناصر النماذج (مربع النص، زر الخيار).

color

يحدد هذا المتغير لون الخط المستخدم في  عناصر النماذج (مربع النص، زر الخيار).

border

يحدد هذا المتغير شكل الإطار.

background-color

يحدد هذا المتغير لون خلفية عنصر النموذج.

 

أضف تعليق


كود امني
تحديث

المزيد في هذه الفئة :


Go to top