Используйте выражение 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" >
<голова>
<title>www.downcodes.com</title>
<meta name="Автор" content="JustinYoung"/>
<meta name="Ключевые слова" content=""/>
<meta name="Description" content=""/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
вход
{
background-color:expression(this.type=="text"?'#FFC':'');
}
</стиль>
</голова>
<тело>
<дл>
<dt>Это обычное текстовое поле:<dd><input type="text" name="">
<dt>Это обычная кнопка:<dd><input type="button" value="i'm button">
</дл>
</тело>
</html>
Другой способ:
Пример исходного кода
[www.downcodes.com] вход{
масштабирование: выражение(функция(ele){(ele.className)?ele.className+=" "+ele.type:ele.className=ele.type; ele.style.zoom = "1";}(this));
}
1. Удалите атрибуты ввода и присвойте их className.
2. Для выражения используется незначительный атрибут (здесь масштабирование). После обработки того, что необходимо сделать, этот атрибут перезаписывается для решения проблемы эффективности непрерывного выполнения выражения.
Код:
Пример исходного кода
[www.downcodes.com] <!--[если это IE 7]>
<style type="text/css" media="screen">
вход{
масштабирование: выражение(функция(ele){(ele.className)?ele.className+=" "+ele.type:ele.className=ele.type; ele.style.zoom = "1";}(this));
}
input.text{
граница: 1 пиксель, цвет границы: #CCC #EEE #EEE #CCC;
фон: #F5F5F5;
}
input.пароль{
граница: 1 пиксель, цвет границы: #CCC #EEE #EEE #CCC;
цвет: #000; фон: #F5F5F5;
ширина: 50 пикселей;
}
input.button{
граница: 1 пиксель, цвет границы: #EEE #CCC #CCC #EEE;
цвет: #000; шрифт: жирный; фон: #F5F5F5;
}
input.reset{
граница: 1 пиксель, цвет границы: #EEE #CCC #CCC #EEE;
цвет: #666; фон: #F5F5F5;
}
</стиль>
<![конец]-->
<style type="text/css" media="all">
ввод[тип="текст"]{
граница: 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;
}
</стиль>
</голова>
<тело>
<input type="text" name="xx" />
<input type="password" name="yy" />
<input type="checkbox" name="oo" />
<input type="radio" name="pp" />
<input type="button" name="qq" value="button" />
<input type="reset" name="oo" value="reset" />
</тело>
</html>
