test1
Page 1 sur 1 • Partagez
- Code:
<div class="MH7"><div class="imgMH7" style="background-image: url(https://i.pinimg.com/564x/d7/d3/dc/d7d3dc58a2726d34415fcb2c7f6c0240.jpg), url(https://i.postimg.cc/d3rZM0QB/ezgif-4-5e5f8d7fc607.gif);"><div><div style="background-image: url(https://i.pinimg.com/564x/65/ba/88/65ba88d53ee4608111357a785eee49de.jpg);"></div><strong>Recetario</strong></div></div><div class="inMH7">
<div><div style="background-image: url(https://i.pinimg.com/564x/d7/d3/dc/d7d3dc58a2726d34415fcb2c7f6c0240.jpg);"></div><span><b>Nombre o Título</b><div>Liquorice pastry jujubes halvah. Biscuit wafer jelly lemon drops dragée bear claw. Fruitcake powder cookie.
Soufflé cookie sweet roll tiramisu cotton candy apple pie pastry cheesecake cupcake. Dragée bear claw pie muffin gummi bears jelly beans sweet roll bear claw jujubes. Cake cake ice cream tart sweet chocolate cake apple pie.</div></span></div>
<div><div style="background-image: url(https://i.pinimg.com/564x/d7/d3/dc/d7d3dc58a2726d34415fcb2c7f6c0240.jpg);"></div><span><b>Nombre o Título</b><div>Soufflé cookie sweet roll tiramisu cotton candy apple pie pastry cheesecake cupcake. Dragée bear claw pie muffin gummi bears jelly beans sweet roll bear claw jujubes. Cake cake ice cream tart sweet chocolate cake apple pie.</div></span></div>
<div><div style="background-image: url(https://i.pinimg.com/564x/d7/d3/dc/d7d3dc58a2726d34415fcb2c7f6c0240.jpg);"></div><span><b>Nombre o Título</b><div>Soufflé cookie sweet roll tiramisu cotton candy apple pie pastry cheesecake cupcake. Dragée bear claw pie muffin gummi bears jelly beans sweet roll bear claw jujubes. Cake cake ice cream tart sweet chocolate cake apple pie.</div></span></div>
<div><div style="background-image: url(https://i.pinimg.com/564x/d7/d3/dc/d7d3dc58a2726d34415fcb2c7f6c0240.jpg);"></div><span><b>Nombre o Título</b><div>Soufflé cookie sweet roll tiramisu cotton candy apple pie pastry cheesecake cupcake. Dragée bear claw pie muffin gummi bears jelly beans sweet roll bear claw jujubes. Cake cake ice cream tart sweet chocolate cake apple pie.</div></span></div>
</div></div><a class="miMH7" href="https://emmescodes.tumblr.com/" title="Code by Emme">Emme</a>
<link href="https://fonts.googleapis.com/css?family=Nunito|Yeon+Sung&display=swap" rel="stylesheet"><style>.MH7, .MH7 * {box-sizing: border-box; scrollbar-color: #444 #0003; scrollbar-width: thin;} .MH7 {width: 400px; margin: auto; font: 12px Nunito; background-color: #111; background-image: url(https://i.postimg.cc/d3rZM0QB/ezgif-4-5e5f8d7fc607.gif); background-blend-mode: screen; min-height: 400px; position: relative; transform-style: preserve-3d; perspective: 1400px; color: #999; padding: 40px;} .MH7:before, .imgMH7 {position: absolute; -webkit-mask-image: url(https://i.postimg.cc/1X5228Kx/00303.png); -webkit-mask-position: right center; -webkit-mask-size: cover; background-position: center; background-size: cover; background-blend-mode: screen; transition: 1s; top: 0; left: 0; bottom: 0; right: 0; transform-origin: left center; z-index: 5;} .MH7:before {content:""; background: url(https://i.postimg.cc/d3rZM0QB/ezgif-4-5e5f8d7fc607.gif), #111;} .MH7:hover:before, .MH7:hover .imgMH7 {transform: rotateY(-100deg);} .imgMH7 {backface-visibility: hidden;} .imgMH7 > div {border: 1px solid; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 100px 20px 0; box-shadow: inset 0 0 5px #000, 0 0 5px #000, 0 0 15px #000; background: #1119;} .imgMH7 strong {font: 20px Yeon Sung; display: block; margin: 0 0 -12px; text-shadow: 1px 1px #111, -1px 1px #111, 1px -1px #111, -1px -1px #111, 0 0 5px #111, 0 0 10px #111; letter-spacing: 2px; color: #DDD;} .imgMH7 > div > div {width: 70px; height: 70px; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); border-radius: 50%; border: 1px solid; padding: 5px; background-clip: content-box; box-shadow: inset 0 0 0 5px #1119, 0 0 5px #111, 0 0 15px #111; background-position: center; background-size: cover;} .inMH7 {border: 1px solid #444; background: #1119; max-height: 402px; overflow: auto; transition: 2s; opacity: 0; filter: blur(30px);} .MH7:hover .inMH7 {opacity: 1; filter: blur(0px);} .inMH7 > div {position: relative; height: 120px; margin: 10px; border: 1px solid #444; padding: 5px 5px 5px 120px;} .inMH7 > div:nth-of-type(even) {padding: 5px 120px 5px 5px;} .inMH7 > div > div {position: absolute; border: 1px solid #444; left: 5px; top: 5px; bottom: 5px; width: 110px; background-position: center; background-size: contain;} .inMH7 > div:nth-of-type(even) > div {left: inherit; right: 5px;} .inMH7 > div > span > b {display: block; border: 1px solid #444; text-align: center; letter-spacing: 1px; font-size: 10px; text-transform: uppercase; padding: 2px 0 0 1px;} .inMH7 > div > span > div {border: 5px solid transparent; margin: 6px 1px 0; height: calc(100% - 25px); padding-right: 3px; overflow: auto; text-align: justify; hyphens: auto; line-height: 12px; outline: 1px solid #444;} .inMH7 > br {display: none;} .miMH7 {display: block; font: 10px arial; letter-spacing: 2px; text-align: center; transition: 0.5s;} .miMH7:hover {letter-spacing: 10px;} .MH7 div::-webkit-scrollbar {width: 5px !important; height: 5px !important; background: #0006 !important;} .MH7 div::-webkit-scrollbar-thumb {background: #444 !important;}</style>
Crédits : trucmuche
Multicomptes : machin machin
Messages : 332
Honneurs : 725
Date d'inscription : 30/11/2021
Localisation : blablabla
Le Maître
Admin
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
Lun 22 Avr - 16:10 par Le Maître
» annexe cites libres (uc)
Jeu 4 Avr - 16:15 par Le Maître
» Annuaire des maisons
Jeu 4 Avr - 15:52 par Le Maître
» test couleur
Sam 30 Mar - 12:31 par Nyma
» [Univers] Temps de voyage
Ven 29 Mar - 22:12 par Ohmazette
» Test écritures
Jeu 28 Mar - 23:53 par Le Maître
» Test old fiches
Jeu 28 Mar - 22:26 par Compte Test
» Annexes principales
Dim 17 Mar - 5:15 par Le Maître
» Annexes
Dim 17 Mar - 4:09 par Le Maître