Skip to content

Instantly share code, notes, and snippets.

@ddnn55

ddnn55/index.html

Created December 23, 2019 23:14
Show Gist options
  • Save ddnn55/11fe1c8172e8eb420f6e429f4382f2fe to your computer and use it in GitHub Desktop.
Save ddnn55/11fe1c8172e8eb420f6e429f4382f2fe to your computer and use it in GitHub Desktop.
Download ZIP
RwNVObY
Raw
index.html
<div class="root">
<div class="card one"></div>
<div class="card two"></div>
<div class="card three"></div>
<div class="card four"></div>
<div class="card five"></div>
<div class="card six"></div>
<div class="card seven"></div>
</div>
Raw
style.css
.root {
perspective: 800px;
}
.card {
width: 512px;
height: 512px;
background-color: gray;
background-size: cover;
background-position: center center;
transform: rotate3d(1, 0, 0, 45deg);
}
.card.one {
background-image: url(http://www.placekitten.com/g/1024/1024);
}
.card.two {
background-image: url(http://www.placekitten.com/g/1025/1024);
}
.card.three {
background-image: url(http://www.placekitten.com/g/1026/1024);
}
.card.four {
background-image: url(http://www.placekitten.com/g/1027/1024);
}
.card.five {
background-image: url(http://www.placekitten.com/g/1028/1024);
}
.card.six {
background-image: url(http://www.placekitten.com/g/1029/1024);
}
.card.seven {
background-image: url(http://www.placekitten.com/g/1030/1024);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment