-------------------------КООРДИНАТЫ, РАЗМЕРЫ--------------------------------
div {
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 50px auto;
}
div::before,
div::after {
position: absolute;
font-size: 25px;
font-weight: bold;
padding-bottom: 20px;
background-repeat: no-repeat;
background-position: 50% 100%;
background-size: 25px auto;
}
div::before {
top: 5px;
left: 5px;
}
div::after {
bottom: 5px;
right: 5px;
}
-------------------------------------------КОНТЕНТ----------------------------------------------
-------1карта--------
.ace-heart,
.ace-heart::before,
.ace-heart::after {
background-image: url("/assets/course57/heart.svg");
}
.ace-heart::before,
.ace-heart::after {
content: “A”;
color: red;
}
-------2карта--------
.two-spade,
.two-spade::before,
.two-spade::after {
background-image: url("/assets/course57/spade.svg");
}
.two-spade::before,
.two-spade::after {
content: “2”;
color: black;
}
может кому и пригодится, вдруг кто-то не понял
можно поиграться меняя параметры контента (даже задать club.svg или diamond.svg)