Alexander77: Bild vergrößern bei hover

Beitrag lesen

SELF-Forum

Bild vergrößern bei hover

Alexander77
– Informationen zu den Bewertungsregeln

Hi,
Ich würde gerne die Bilder, die im folgenden Code eingebunden sind, vergrößern, sobald man mit der Maus drüber fährt. Dabei soll sich das Bild dann über den Rest, also über die Schrift sowie die anderen Divs legen. Ich hoffe ihr könnt mir hier weiterhelfen.

<html>  
<head>  
<style type="text/css">  
body{background-color: grey;}  
  
#all {  
margin: auto;  
padding: 0;  
width: 1094px;  
}  
  
.reihe1{  
float: left;  
margin-left: 50px;  
margin-top: 50px;  
height: 200px;  
width: 450px;  
background-color: #343434;  
}  
  
.reihe2{  
float: left;  
margin-left: 94px;  
margin-top: 50px;  
height: 200px;  
width: 450px;  
background-color: #343434;  
}  
  
.bild1{  
border-radius: 5px;  
height: 180px;  
width: 180px;  
float: left;  
margin-left: 10px;  
margin-top: 10px;  
}  
  
.text1{  
float: left;  
margin-left: 10px;  
width: 250px;  
height: 200px;  
text-align: center;  
color: white;  
}  
  
.name{  
font-weight: bold;  
font-size: 14px;  
line-height: 20px;  
}  
.titel{  
font-size: 13px;  
margin-top: 0px;  
line-height: 20px;  
}  
.bild2{  
border-radius: 5px;  
height: 180px;  
width: 180px;  
float: left;  
margin-right: 10px;  
margin-top: 10px;  
}  
.text2{  
float: left;  
margin-right: 10px;  
width: 250px;  
height: 200px;  
text-align: center;  
color: white;  
}  
  
  
</style>  
  
</head>  
<body>  
<div id="all">  
	<div class="reihe1">  
	<img src="bild.jpg" class="bild1" alt="">  
	<div class="text1">  
	<p class="name">Name</p><br>  
	<p class="titel">Titel</p></div>  
	</div>  
	<div class="reihe2">  
	<div class="text2">  
	<p class="name">Name</p><br>  
	<p class="titel">Titel</p></div>  
	<img src="bild2.jpg" class="bild2" alt="">  
	</div></div>  
</body>  
</html>

Danke schonmal!

Beitrag melden
–
Informationen zu den Bewertungsregeln