Wie schreibt man ein:hover in Inline-CSS?

Question

Ich habe einen Fall, in dem ich Inline-CSS-Code schreiben muss, und ich möchte einen Hover-Stil auf einen Anker anwenden.

Wie kann ich die a:hover in Inline-CSS innerhalb des HTML-Style-Attributs?

Sie können z. B. keine CSS-Klassen in HTML-E-Mails verwenden.

Answer 1

Das können Sie tun. Aber nicht in Inline-Styles. Sie können verwenden onmouseover y onmouseout Veranstaltungen:

<div style="background: #333; padding: 10px; cursor: pointer"
   onmouseover="this.style.backgroundColor='#555';" onmouseout="this.style.backgroundColor='#333';">
      Hover on me!
</div>

Answer 2

<style>a:hover { }</style>
<a href="http://stackoverflow.com/">Go Home</a>

Hover ist eine Pseudoklasse und kann daher nicht mit einem Stilattribut angewendet werden. Sie ist Teil des Selektors.

Answer 3

Ihren Kommentaren zufolge senden Sie ohnehin eine JavaScript-Datei. Machen Sie den Rollover in JavaScript. jQuery 's $.hover() Methode macht es einfach, wie jeder andere JavaScript-Wrapper auch. Es ist auch nicht allzu schwer in direktem JavaScript.

Answer 4

Es gibt keine Möglichkeit, dies zu tun. Sie haben die Möglichkeit, einen JavaScript- oder CSS-Block zu verwenden.

Vielleicht gibt es eine JavaScript-Bibliothek, die ein proprietäres Stilattribut in einen Stilblock umwandelt. Aber dann ist der Code nicht standardkonform.

Answer 5

Ich habe mir gerade eine andere Lösung ausgedacht.

Mein Problem: Ich habe ein <a> Tag um einige Folien/Hauptinhalt-Viewer sowie <a> Tags in der Fußzeile. Ich möchte, dass sie im IE an dieselbe Stelle gesetzt werden, so dass der gesamte Absatz unterstrichen wird onHover obwohl sie keine Links sind: Die Folie als Ganzes ist ein Link. Der IE kennt den Unterschied nicht. Ich habe auch einige tatsächliche Links in meiner Fußzeile, die unterstrichen und farblich verändert werden müssen onHover . Ich dachte, ich müsste die Stile in die Fußzeilen-Tags einfügen, um die Farbe zu ändern, aber die obigen Hinweise deuten darauf hin, dass dies unmöglich ist.

Lösung: Ich gab den Fußzeilen-Links zwei verschiedene Klassen, und mein Problem war gelöst. Ich war in der Lage, die onHover Farbwechsel in einer Klasse, lassen Sie die Folien onHover keine Farbänderung/Unterstreichung haben und trotzdem die externen HREFS in der Fußzeile und den Folien gleichzeitig haben können!