Der CSS-Ausdruck zur Beurteilung des Ausdrucks legt den Eingabestil fest

Autor：Eve Cole Aktualisierungszeit：2009-06-20 17:34:55

Verwenden Sie den CSS-Ausdruck, um den Ausdruck zum Festlegen des Eingabestils zu bestimmen, der einfach und leichtgewichtig ist. Der Nachteil besteht darin, dass FireFox den Ausdruck Urteilsausdruck nicht unterstützt. Das Fatale daran ist, dass Sie nur eines unterscheiden können (im Beispiel können Sie beispielsweise nur das Textfeld unterscheiden). Versuchen Sie nicht, mehrere festzulegen. Die folgenden überschreiben die obersten ... Orz ... .

Code:

Beispiel-Quellcode [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" >
<Kopf>
<title>www.downcodes.com</title>
<meta name="Author" content="JustinYoung"/>
<meta name="Keywords" content=""/>
<meta name="Description" content=""/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
Eingang
{
Hintergrundfarbe:Ausdruck(this.type=="text"?'#FFC':'');
}
</style>
</head>

<Körper>
<dl>
<dt>Dies ist ein normales Textfeld:<dd><input type="text" name="">
<dt>Dies ist eine normale Schaltfläche:<dd><input type="button" value="i'm button">
</dl>
</body>
</html>

Ein anderer Weg:

Beispiel-Quellcode [www.downcodes.com]

Eingang{
zoom: expression(function(ele){(ele.className)?ele.className+=" "+ele.type:ele.className=ele.type; ele.style.zoom = "1";}(this));
}

1. Nehmen Sie die Attribute der Eingabe heraus und weisen Sie sie className zu.
2. Für den Ausdruck wird ein unbedeutendes Attribut (hier Zoom) verwendet, um ihn auszulösen. Nach der Verarbeitung dessen, was getan werden muss, wird dieses Attribut überschrieben, um das Effizienzproblem der kontinuierlichen Ausführung des Ausdrucks zu lösen.

Code:

Beispiel-Quellcode [www.downcodes.com]

<style type="text/css" media="all">
Eingabe[type="text"]{
Rand: 1px fest; Randfarbe: #CCC #EEE #EEE #CCC;
Hintergrund: #F5F5F5;
}
Eingabe[Typ="Passwort"]{
Rand: 1px fest; Randfarbe: #CCC #EEE #EEE #CCC;
Farbe: #000; Hintergrund: #F5F5F5;
Breite: 50px;
}
Eingabe[type="button"]{
Rand: 1px einfarbig; Randfarbe: #EEE #CCC #CCC #EEE;
Farbe: #000; Schriftstärke: fett; Hintergrund: #F5F5F5;
}
input[type="reset"]{
Rand: 1px einfarbig; Randfarbe: #EEE #CCC #CCC #EEE;
Farbe: #666; Hintergrund: #F5F5F5;
}
</style>
</head>
<Körper>
<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" />
</body>
</html>