CSS und JS arbeiten eng zusammen, um unseren Seiten viele einzigartige Effekte hinzuzufügen. Es gibt auch verwandte Fälle auf 52CSS.com. Um einen besonderen Effekt zu erzielen, müssen wir Javascript verwenden, um die CSS-Eigenschaften eines bestimmten Tags dynamisch zu ändern. Beispiel: Wenn die Maus über ein Bild fährt, fügen wir dem Bild einen Rahmen hinzu. Der Code könnte wie folgt aussehen: Was sollte das Attribut nach dem Stil in JavaScript sein?
<script type="text/javascript">
Funktion imageOver(e) {
e.style.border="1px durchgehend rot";
}
Funktion imageOut(e) {
e.style.borderWidth=0;
}
</script>
<img src="01.png" onmouseover="imageOver(this)" onmouseout="imageOut(this)" />
JavaScript-CSS-Stil, Attributvergleichstabelle,
Feldbezeichnung und Attributvergleich,
CSS-Syntax (Groß- und Kleinschreibung nicht beachtet) JavaScript Syntax (Groß-/Kleinschreibung beachten)
Grenzgrenze
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
border-bottom-width borderBottomWidth
border-color borderColor
border-left borderLeft
border-left-color borderLeftColor
border-left-style borderLeftStyle
border-left-width borderLeftWidth
border-right borderRight
border-right-color borderRightColor
border-right-style borderRightStyle
border-right-width borderRightWidth
border-style borderStyle
border-top borderTop
border-top-color borderTopColor
border-top-style borderTopStyle
border-top-width borderTopWidth
border-width borderWidth
klar klar
float floatStyle
Marge Marge
margin-bottom marginBottom
margin-left marginLeft
margin-right marginRight
margin-top marginTop
Polsterung
Polsterung unten PolsterungBottom
padding-left paddingLeft
padding-right paddingRight
padding-top paddingTop-
Farb- und Hintergrund-Tags und -Attribute im Vergleich zur
CSS-Syntax (Groß-/Kleinschreibung wird nicht beachtet) JavaScript-Syntax (Groß-/Kleinschreibung wird beachtet)
Hintergrundhintergrund
Hintergrund-Anhang Hintergrund-Anhang
Hintergrundfarbe Hintergrundfarbe
Hintergrundbild backgroundImage
Hintergrundposition Hintergrundposition
Hintergrundwiederholung Hintergrundwiederholung
Farbe Farbe
Stil-Tags und -Attribute sind vergleichbar mit
der CSS-Syntax (Groß-/Kleinschreibung wird nicht beachtet) und der JavaScript-Syntax (Groß-/Kleinschreibung wird beachtet)
Anzeigeanzeige
Listenstiltyp listStyleType
Listenstil-Bild listStyleImage
Listenstilposition listStylePosition
Listenstil listStyle
Leerzeichen WhiteSpace-
Textstil-Tags und -Attribute im Vergleich zur
CSS-Syntax (Groß-/Kleinschreibung wird nicht beachtet) JavaScript-Syntax (Groß-/Kleinschreibung wird beachtet)
Schriftart
Schriftartenfamilie Schriftartenfamilie
Schriftgröße Schriftgröße
Schriftart-Schriftstil
Schriftartvariante FontVariant
Font-Weight FontWeight-
Text-Tags und -Attribute im Vergleich zur
CSS-Syntax (Groß-/Kleinschreibung wird nicht beachtet) JavaScript-Syntax (Groß-/Kleinschreibung wird beachtet)
Buchstabenabstand Buchstabenabstand
Zeilenumbruch Zeilenumbruch
Zeilenhöhe lineHeight
Textausrichtung textAlign
Textdekoration TextDekoration
Texteinzug textIndent
Textausrichtung textJustify
Texttransformation textTransform
Vertical-Align VerticalAlign