-1

Ich habe Probleme damit, ein div ändern Hintergrundfarbe, wenn Text schwebt.Hover Text Make Div Farbe ändern - CSS

ich eine absolute Position für die div.book mit einem Absolutwert von Text über sie bin mit so der Text über die div schwebt, Text auf z-Index 3 und div auf 2.

Wenn ich die schweben div die ganze Hintergrund ändert sich jedoch der Text für die meisten der div und wenn seine schwebte nichts ändert, so habe ich versucht:

h1:hover + div.book { 
 
    background-color: rgba(333, 33, 33, 1); 
 
} 
 

 
.book { 
 
    height: 50px; 
 
    }

<h1>Book</h1> 
 
<div class="book"></div>

Aber ich kann nicht scheinen, um es zu bekommen zu arbeiten?

Irgendwelche Ideen?

Vielen Dank im Voraus!

Quelle

2016-08-15 Bethfiander

Fragen Code Hilfe suchen müssen den kürzesten Code enthalten notwendig, es zu reproduzieren ** in der Frage selbst ** vorzugsweise in einem [Stapel Snippet] (https://blog.stackoverflow.com/2014/09/Einführung-Runnable-Javascript-CSS-und-HTML-Code-Snippets /). Siehe So erstellen Sie ein [minimales, vollständiges und überprüfbares Beispiel] (http://stackoverflow.com/help/mcve). – andreas

Fügen Sie bitte Ihren HTML-Code hinzu, ohne die Struktur Ihres HTML zu sehen. Wie können wir Ihnen eine Lösung liefern? – Aaron

Buch

' „Buch“ ist optisch innerhalb des div class Buchs aus den absoluten Positionen, ich brauche, wenn h1 div class schwebt wird = „Buch“ Änderungen Hintergrundfarbe. Ich habe versucht: 'h1: Hover + div.book { Hintergrundfarbe: rgba (333,33,33, 1); } ' – Bethfiander

Platz der h1 innerhalb des <div></div>. Die 2 Elemente werden nun einander überlappen. Breite zu .book hinzufügen. Und schließlich die Farbe (= Textfarbe) transparent einstellen, so dass keine Buchstaben angezeigt werden.

h1:hover { 
 
    background: red; 
 
    color: rgba(0, 0, 0, 0); 
 
} 
 

 
.book { 
 
    height: 50px; 
 
    width: 200px; 
 
    }

<div class="book"> 
 
    <h1>Book</h1> 
 
</div>

Quelle

2016-08-15 21:50:16 ApoLLoSkiLLz

Danke für die Hilfe, nur Grund seine Außenseite ist aufgrund der Schriftart im Einsatz macht die Lücke an der Spitze zu groß und sitzt nicht in der Mitte. Ich habe jedoch behoben **, indem Sie hinein wie Sie sagen und eine feste Position anstelle von absolut und bewegen sie mit Rändern zu zentrieren **, danke für zu helfen, obwohl zu viele Leute, die kommentieren für Kommentare Sake auf Upvotes hoffen. – Bethfiander

h1:hover + div.book { 
 
    background-color: rgba(333, 33, 33, 1); 
 
} 
 

 
.book{ position: absolute; z-index: 2; background-color:rgba(333,33,33, 0.6);width: 230px; height: 60px; border-radius:40px 40px 40px 40px;-moz-border-radius:40px 40px 40px 40px;-webkit-border-radius:40px 40px 40px 40px; border:1px solid #999;} 
 
div.book:hover{background-color:rgba(333,33,33, 1);} 
 
h1 {font-family: 'tahoma', cursive; color:#FFF;font-size:48px; text-shadow:3px 3px #000; position:absolute; z-index:3;}

<div class="welcome"> \t \t \t \t 
 
      <center><h1>Book</h1></center> 
 
      <div class="book"> 
 
      
 
      \t </div> 
 
</div>

Quelle

2016-08-15 21:29:32 Bethfiander

Hover Text Make Div Farbe ändern - CSS

Buch

Antwort

Verwandte Themen