2009-02-06 3 views
17

Gibt es eine elegante Möglichkeit, einen bestimmten Stil auf alle Elemente unter IE6 <input type="text"> anzuwenden? Ich kann das mit ein wenig JavaScript machen, aber ich habe mich gefragt, ob es eine elegantere Vorgehensweise gibt.Wie style <input type = "text"> in IE6 CSS?

Hinweis - Ich kann eine bestimmte Klasse nicht von Hand auf alle Textfelder anwenden. Und ich möchte avoid CSS expressions.

Antwort

14

AFAIK nicht IE6 unterstützt attribute selectors, so denke ich, die Antwort ist nein. Sie müssten einen der folgenden verwenden:

  1. Fügen Sie allen <input type="text"/> Elementen ein gemeinsames Klassenattribut hinzu.
  2. Verwenden Sie JavaScript, wie Sie vorgeschlagen haben.

Beide von denen Sie vermeiden möchten. Schade.

+0

jQuery kann JavaScript-Styling viel weniger schmerzhaft machen, da es Auswahlfilter sehr ähnlich mit CSS – Aleris

+1

@Alertis: true, aber es ist immer noch Javascript. –

+0

Es ist eine interne Webanwendung, die sowieso stark von JavaScript abhängig ist. Die Verwendung für das Styling ist kein Problem. Ich habe mich nur gefragt, ob es einen besseren Weg gibt. –

1

Haben Sie auch andere Eingabeelemente, die Sie anders als das Element "text" gestalten möchten? Falls nicht, gelten nur den Stil für alle Eingabeelemente mit CSS:

input { 
border: 1px #8194b2 solid; 
font : normal 100% "Tahoma", sans-serif; 
} 
+0

Leider möchte ich in der Tat nicht betroffen andere Typen verlassen. Ich werde Dinge wie Höhe und Hintergrundfarbe ändern, so dass es z. B. auf eine Checkbox ziemlich unangenehm wirken würde. –

+0

In der Tat. Da Sie nur Javascript für einige kleinere Styling verwenden, denke ich, dass Sie es rechtfertigen können. Es wirkt sich nicht auf die Funktionalität für die Minderheit ohne Javascript aus. – Stuart

1

Funktioniert die Eingabe eines Klassenattributs für Ihr Eingabeelement?

input.text {

// einige CSS-Attribute und Werte hier ....

}

  • vielleicht eleganter als JS
8

Wenn Sie jQuery verwenden, versuchen Sie, dies zu Ihrem onDOMready hinzuzufügen:

$('input[type="text"]').addClass('typeText'); 

in Ihrem CSS Dann könnte man so wie etwas:

input.typeText, input[type="text"] { 
    color:#efefef; 
}