<!DOCTYPE html>
<html>
<head>
<style>
.div1 {
font-size: 30px;
font-weight: bold;
width: 280px;
height: 40px;
padding: 10px;
background: beige;
font-family: verdana;
border: 1px solid green;
transform-style: preserve-3d;
transition: transform 1.5s;
transform: rotate3d(1, 1, 1, 30deg);
margin: 50px auto;
}
.div1:hover,
.div1:focus {
transform: rotate3d(1, 1, 1, 30deg)
matrix3d(1, 0, 0, 0, 0, 1, 6, 0, 0, 0, 1, 0, 50, 100, 0, 1.1);
}
</style>
</head>
<body>
<h1>The matrix3d() function</h1>
<div class="div1">W3Schools.com</div>
</body>
</html>