استخدم تعبير CSS لتحديد التعبير لتعيين نمط الإدخال، وهو بسيط وخفيف الوزن. العيب هو أن FireFox لا يدعم التعبير الحكمي. الشيء القاتل هو أنه يمكنك تمييز واحد فقط (على سبيل المثال، في المثال، يمكنك فقط تمييز مربع النص النصي)، لا تحاول تعيين عدة، فالعناصر التالية ستحل محل العناصر العلوية... أورز.. .
شفرة:
مثال لكود المصدر
[www.downcodes.com] <!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<الرأس>
<العنوان>www.downcodes.com</title>
<meta name="Author" content="JustinYoung"/>
<اسم التعريف = "الكلمات الرئيسية" المحتوى = ""/>
<اسم التعريف = "الوصف" المحتوى = ""/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<نمط النوع = "نص/CSS">
مدخل
{
لون الخلفية: التعبير (this.type=="text"?'#FFC':'');
}
</نمط>
</الرأس>
<الجسم>
<دل>
<dt>هذا مربع نص عادي:<dd><input type="text" name="">
<dt>هذا زر عادي:<dd><input type="button" value="i'm Button">
</دل>
</الجسم>
</html>
طريقة أخرى:
مثال لكود المصدر
[www.downcodes.com] مدخل{
Zoom: Expression(function(ele){(ele.className)?ele.className+=" "+ele.type:ele.className=ele.type; ele.style.zoom = "1";}(this));
}
1. قم بإزالة سمات الإدخال وقم بتعيينها إلى className.
2. بالنسبة للتعبير، يتم استخدام سمة غير مهمة (هنا التكبير) لتشغيله، بعد معالجة ما يجب القيام به، تتم الكتابة فوق هذه السمة لحل مشكلة كفاءة التنفيذ المستمر للتعبير.
شفرة:
مثال لكود المصدر
[www.downcodes.com] <!--[إذا كان IE 7]>
<نمط نوع = "نص / CSS" وسائل الإعلام = "الشاشة">
مدخل{
Zoom: Expression(function(ele){(ele.className)?ele.className+=" "+ele.type:ele.className=ele.type; ele.style.zoom = "1";}(this));
}
إدخال النص {
الحدود: 1 بكسل لون الحدود: #CCC #EEE #EEE #CCC؛
الخلفية: #F5F5F5؛
}
الإدخال. كلمة المرور {
الحدود: 1 بكسل لون الحدود: #CCC #EEE #EEE #CCC؛
اللون: #000 الخلفية: #F5F5F5؛
العرض: 50 بكسل؛
}
زر الإدخال {
الحدود: 1 بكسل لون الحدود: #EEE #CCC #CCC #EEE؛
اللون: #000؛ وزن الخط: غامق الخلفية: #F5F5F5؛
}
الإدخال. إعادة تعيين {
الحدود: 1 بكسل لون الحدود: #EEE #CCC #CCC #EEE؛
اللون: #666 الخلفية: #F5F5F5؛
}
</نمط>
<![endif]-->
<نمط نوع = "نص / CSS" وسائل الإعلام = "الكل">
الإدخال[نوع = "نص"] {
الحدود: 1 بكسل لون الحدود: #CCC #EEE #EEE #CCC؛
الخلفية: #F5F5F5؛
}
الإدخال[نوع = "كلمة المرور"] {
الحدود: 1 بكسل لون الحدود: #CCC #EEE #EEE #CCC؛
اللون: #000 الخلفية: #F5F5F5؛
العرض: 50 بكسل؛
}
الإدخال[نوع = "زر"] {
الحدود: 1 بكسل لون الحدود: #EEE #CCC #CCC #EEE؛
اللون: #000؛ وزن الخط: غامق الخلفية: #F5F5F5؛
}
الإدخال[نوع = "إعادة تعيين"] {
الحدود: 1 بكسل لون الحدود: #EEE #CCC #CCC #EEE؛
اللون: #666 الخلفية: #F5F5F5؛
}
</نمط>
</الرأس>
<الجسم>
<نوع الإدخال = "نص" اسم = "xx" />
<نوع الإدخال = "كلمة المرور" الاسم = "yy" />
<نوع الإدخال = "مربع الاختيار" اسم = "oo" />
<نوع الإدخال = "راديو" اسم = "ص" />
<نوع الإدخال = "زر" اسم = "QQ" قيمة = "زر" />
<نوع الإدخال = "إعادة تعيين" اسم = "oo" قيمة = "إعادة تعيين" />
</الجسم>
</html>
