Keean by @MILENUCCIA87 - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

_parentApre collegamenti ipertestuali nell'elemento genitore
<p>Serve a definire paragrafi di testo
<select>Usato per creare un menu a tendina.
<iframe>Crea un frame all'interno di una pagina HTML.
maxlengthDetermina il numero massimo di caratteri consentiti in un elemento input
disabledImpedisce la modifica di un input

Users

Log in to search for users

Explore

Find inspiration

esercizio 2 (italia)

pag. 6 progetto inf

Inserimento di immagini

Template prodotti Meguiar

Effetto zoom con CSS

I benefici dell\\

fibonacci manoel

HTML con CSS esempio generale

Scheda Tecnica iPhone 15 Pro

JS Istruzioni condizionali es3

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<style>
  @import url('https://fonts.googleapis.com/css2?family=Nunito&display=swap');

  ::-webkit-scrollbar {
    background-color: #000000;
    width: 0px;
  }

  ::-webkit-scrollbar-track {
    background-color: #000000;
  }

  ::-webkit-scrollbar-track-piece {
    background-color: #101010;
  }

  ::-webkit-scrollbar-thumb {
    background-color: #000;
    border-radius: 5px;
  }

  .base {position: relative; background-color: none; 
       width: 600px; 
       height: 700px;
       margin-top: 30px;}

  .image {
    display: block;
    width: 500px;
    height: 500px;
  }

  .overlay {
    position: relative;
    top: -500px;
    bottom: 0;
    left: 0;
    right: 0;
    height: 500px;
    width: 500px;
    opacity: 0;
    transition: 1.2s all ease-in-out;
  }

  .base:hover .overlay {
    opacity: 1;
  }

  .base:hover .quote {
    position: relative;
    margin-top: -520px;
    margin-left: 5px;
    transition: 1s all ease-in-out
  }

  .quote {
    position: relative;
    margin-top: -650px;
    margin-left: 5px;
    font-size: 10px;
    color: #777;
    font-family: arial;
    text-transform: uppercase;
    padding: 1px;
    transition: 1s all ease-in-out
  }
c { font-family: Tahoma; color: #875c4f; font-size: 10px; letter-spacing: 1px; line-height: 6px; font-weight: 700; text-transform: uppercase;}
f { font-family: Tahoma; color: #875c4f; font-size: 10px; letter-spacing: 1px; line-height: 6px; font-weight: 700; text-transform: uppercase;}
g { font-family: cambria; font-size: 10px; line-height: 10px; color: #60453d; cursor: default; text-transform:uppercase; display: inline; letter-spacing: 1px;}
h { font-family: tahoma; font-size: 10px; color: #5c545c; text-transform: lowercase; letter-spacing: 1px; line-height: 10px; border-bottom: 1px dashed #b29b7d;}
l {font-family: cambria; color: #948c84; font-size: 11px; letter-spacing: 2px; text-transform: lowercase; font-style: italic; }
m {font-family: cambria; font-size: 11px; color: #5c5c40; text-transform: lowercase; letter-spacing: 1px; line-height: 9px;}
e { background-color: #ccc; font-size: 9px; font-family: calibri; color: #111; text-transform: uppercase;letter-spacing: 1px;}

</style>


  <center>
    <div class="base"><img src="https://i.imgur.com/ZZHOktF.png" style="width: 450px; height:500px;">
      <div class="overlay"><div style="width: 450px; height:500px;">
        <div class="testo1" style="position: absolute; top: 5px; left:30px; padding: 10px; width: 180px; height: 350px; line-height: 10px; overflow: auto; font-size: 11px; color: #666666; font-family: calibri; text-align: justify; background-color: #000; opacity: 0.7;"><center><c><i>I simply do not vibe</i></c><br><e>with the law</e></center><br>
<c>Keean Aemon Macaulay</c>,   <e>Son of the Elements</e>  09.08.04 <b>›</b> @Dublin. <b>›</b> 26 y.o. <b>›</b> <f>Elmyr</f> per il Byrne, <e>Neehan</e> per il Metaverso. <b>›</b> I colori di uno stereotipo di occhi verdi, ciuffi rossi e <g>lentiggini</g> a coprire una pelle che di sole ne ha sempre visto poco. <b>›</b> Cresciuto tra torri di LEGO, pistole d'acqua e <h>chiazze di sangue</h> che riempivano i lavandini di casa. Stretto nella vita di un Cartello che gli ha insegnato come <l>per i propri ideali si finisce anche a morire.</l> Da bambino gli hanno affibbiato tutti gli aggettivi del mondo: agitato, iracondo e <m>irruento</m> come pochi. La laurea in  <m>computer science</m> ha dimostrato che a volte si applica anche. <h>Never underestimate the primal appeal to lose one's self</h> e lui sembra averne fatto un motto e una missione di vita. Una notte di <f>urla e dolore</f> lo fa rinascere come Incarnazione del Fuoco stesso, ma una forza della Natura, sotto sotto, lo è sempre stato. Solo che ora può parlare col bassotto preferito. <i><l>But you have to satisfy the monster. The monster has loved you for longer than anyone else.</l></i> 
        </div>
        <div class="testo2" style="position: absolute; top: 380px; left:30px; padding: 10px; width: 180px; height: 70px; line-height: 10px; overflow: auto; font-size: 11px; color: #666666; font-family: calibri; text-align: justify; background-color: #000; opacity: 0.7;">Affetti affettini, se è troppo grande il box basta ridurre l'height.
        </div>
      </div></div>
      <div class="quote">
        <div style="margin-left: 0px; margin-bottom: 0px; width:280px; transform:rotate(1deg); background-color: #000;padding-left:2px "> when i'll go into the ground i won't go quietly</div>
        <div style="margin-left: 10px; width: 145px;margin-bottom: 0px; background-color: #000; padding-left:2px">i'm bringing my <i>c r o w n</i></div>
        <div style="width:350px ;transform:rotate(-2deg);background-color: #000;padding-left:2px ">when i'll go into the ground they gotta <b>bury me face down</b></div>
      </div></div>
  </center>