[ دورة CSS ] التحويل من CSS إلى JavaScript ج7

[ الدرس السابع ] التحويل من CSS إلى JavaScript

السلام عليكم
هذه لائحة بأهم مراجع CSS وتحويلها إلى java script
مثال:
الـbackground-color في الـCSS لتحويلها إلى الجافاسكريبت سنزيل علامة - ونكبّر الحرف الذي يليها لتصبح backgroundColor هذا حتى نتحكم بها من خلال الجافاسكريبت.

طريقة الإستعمال:

في Internet Explorer :

كود:

document.all.id.style.backgroundColor = "القيمة";

كود:

في NetScape : document.id.style.backgroundColor = "القيمة";

في كل المتصفحات القياسية :

كود:

document.getElementById("id").style.backgroundColor = "القيمة";

وهنا الـid هي تعرفة المعلم التي نعطيها للوسم الذي نريد ان نتحكم في تنسيقه
والكود التالي يبيّن ذلك (الجهة اليسرى CSS أما اليمنى فهيjava script :

background ->-> background

background-attachment ->-> backgroundAttachment

background-color ->-> backgroundColor

background-image ->-> backgroundImage

background-position ->-> backgroundPosition

background-repeat ->-> backgroundRepeat

border ->-> border

border-bottom ->-> borderBottom

border-bottom-color ->-> borderBottomColor

border-bottom-style ->-> borderBottomStyle

border-bottom-width ->-> borderBottomWidth

border-color ->-> borderColor

border-left ->-> borderLeft

border-left-color ->-> borderLeftColor

border-left-style ->-> borderLeftStyle

border-left-width ->-> borderLeftWidth

border-right ->-> borderRight

border-right-color ->-> borderRightColor

border-right-style ->-> borderRightStyle

border-right-width ->-> borderRightWidth

border-style ->-> borderStyle

border-top ->-> borderTop

border-top-color ->-> borderTopColor

border-top-style ->-> borderTopStyle

border-top-width ->-> borderTopWidth

border-width ->-> borderWidth

clear ->-> clear

clip ->-> clip

color ->-> color

cursor ->-> cursor

display ->-> display

filter ->-> filter

font ->-> font

font-family ->-> fontFamily

font-size ->-> fontSize

font-variant ->-> fontVariant

font-weight ->-> fontWeight

height ->-> height

left ->-> left

letter-spacing ->-> letterSpacing

line-height ->-> lineHeight

list-style ->-> listStyle

list-style-image ->-> listStyleImage

list-style-position ->-> listStylePosition

list-style-type ->-> listStyleType

margin ->-> margin

margin-bottom ->-> marginBottom

margin-left ->-> marginLeft

margin-right ->-> marginRight

margin-top ->-> marginTop

overflow ->-> overflow

padding ->-> padding

padding-bottom ->-> paddingBottom

padding-left ->-> paddingLeft

padding-right ->-> paddingRight

padding-top ->-> paddingTop

page-break-after ->-> pageBreakAfter

page-break-before ->-> pageBreakBefore

position ->-> position

float ->-> styleFloat

text-align ->-> textAlign

text-decoration ->-> textDecoration

text-decoration: blink ->-> textDecorationBlink

text-decoration: line-through ->-> textDecorationLineThrough

text-decoration: none ->-> textDecorationNone

text-decoration: overline ->-> textDecorationOverline

text-decoration: underline ->-> textDecorationUnderline

text-indent ->-> textIndent

text-transform ->-> textTransform

top ->-> top

vertical-align ->-> verticalAlign

visibility ->-> visibility

width ->-> width

z-index ->-> zIndex

... نهاية الشرح ...

إقرأ المزيد
طريقة سريعة وسهلة لاختبار سرعة موقعك او مدونتك
كيف تختار الاستضافة المناسبة قبل حجز المدونة
إضافة تعليقات الفيس بوك
طريقة رائعة جذابة لاضافة ازرار المواقع الاجتماعية
كيف تحمي محتويات مدونتك من النقل او السرقة لـ(blogger)
كيفية تركيب قوالب بلوجر

"عَنْ أَبِي هُرَيْرَةَ رَضِيَ اللَّهُ عَنْهُ أَنَّ رَسُولَ اللَّهِ صَلَّى اللَّهُ عَلَيْهِ وَسَلَّمَ قَالَ:مَنْ صَلَّى عَلَيَّ وَاحِدَةً صَلَّى اللَّهُ عَلَيْهِ عَشْرًا"