diedVIPs

html knowhow

Button auf ein Bild setzen













Button auf ein Bild setzen

Damit können Sie einen anklickbaren Button auf ein Bild setzen.
So sieht´s aus

Monroe
Quellcode
<html>
<head>

<style type="text/css">
.container {position: relative;width: 100%;max-width: 400px;}
.container img {width: 100%;height: auto;}
.container .btn {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);background-color: teal;color: white;
font-size: 16px;padding: 12px 24px;border: none;cursor: pointer;border-radius: 5px;text-align: center;}
.container .btn:hover {background-color: black;}
</style>
</head>

<body>
 <div class="container">
<img src="../Bilder/Monroe.jpg" alt="Monroe" style="width:40%"/>
<button class="btn">Button</button>
</div>
</body>

</html>








Kontakt    Datenschutz    Impressum