wie über den Text mit css schweben

Ich möchte den Hover in CSS verwenden, um die Größe des Textes in einem Überschrift-Tag zu erhöhen, jedoch jedes Mal, wenn sie über die Grenze bewegt werden, erhöht sich die Größe.wie über den Text mit css schweben

<!DOCTYPE html> 
    <html> 
    <body> 

    <h1 style="color:blue;margin-left:30px;, 
    h1:hover { 
     position: absolute; 
     top: 0; 
     left: 0; 
     font-size: 30px; 
    }">This is a heading</h1> 
    <p>This is a paragraph.</p> 

    </body> 
    </html>

Quelle

2017-06-22 mithal

Fragen sollten richtig sein –

http://jsfiddle.net/m4k90bso/ –

Sie suchen nach einem normalen Hover-Stil oder müssen die Schriftgröße bei jedem Hover erhöhen? –

Willkommen beim Stapelüberlauf. Hover sollte über CSS erfolgen. Unten ist der Code, den Sie verwenden können.

Code:

<!DOCTYPE html> 
<html> 
<head> 
<style> 
h1:hover { position: absolute; top: 0; left: 0; font-size: 30px; } 
</style> 
</head> 
<body> 
<h1 style="color:blue;margin-left:30px;">This is a heading</h1> 
<p>This is a paragraph.</p> 
</body> 
</html>

Eine Sache zu beachten ist dies mit all h1 der bedeuten wird mit diesem Code betroffen sein. Wenn Sie ein einzelnes H1 zielen wollen, dann würde ich eine Klasse im HTML verwenden und diese im CSS referenzieren.

Wie das ist, was Sie wollten.

Quelle

2017-06-22 05:42:54 Syfer

-: Danke @Syfer, es funktionierte für mich – mithal

Ich möchte nur die Schriftgröße auf Hover erhöhen, ohne die Position zu ändern, wie kann ich dies implementieren? – mithal

Sie können nicht :hover in inline style verwenden .you es in External style sheet OR Internal style sheet verwenden kann.

h1:hover { 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    font-size: 40px; 
 
}

<h1 style="color:blue;margin-left:30px;">This is a heading</h1> 
 
<p>This is a paragraph.</p>

Quelle

2017-06-22 05:47:28 Ehsan

Leider können Sie Hover-Effekte mit Inline-CSS nicht implementieren. Sie müssen externe Stylesheets oder normale Skript-Tags verwenden. Der Code wird wie folgt aussehen:
Style.css:

h1:hover { position: absolute; top: 0; left: 0; font-size: 30px; }

index.html:

<html> 
     <head> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
     </head> 
     <body> 

     <h1>This is a heading</h1> 
     <p>This is a paragraph.</p> 

     </body> 
     </html>

Quelle

2017-06-22 06:09:19 hamzox

wie über den Text mit css schweben

Antwort

Verwandte Themen