TOBIAS by @MILENUCCIA87 - Codewith.it

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

References

formactionPermette di definire l'URL di una pagina web a cui inviare i dati di un form
valueValore alfanumerico o booleano contenuto in un elemento
<table>Tag primario per la creazione di tabelle
<u> Utilizzato definire una parte del contenuto come annotazione non testuale, con una sottolineatura.
formenctypeDefinisce il tipo di codifica dei dati di un elemento input
<canvas>Tag per disegnare grafica dinamica su pagine web.

Users

Log in to search for users

Explore

Find inspiration

Form per il torneo misto disfo

Costruzione di tabella con html5

le miniere di nuxis

Bootstrap Basics

textarea select and replace

PixFlow Agency | Web Design, Video

Lola Harrel Project 2

terne pitagoriche

Inserimento immagini in un testo

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>

/* ------------------------ VARIE --------------------- */
.testo::-webkit-scrollbar {
  width: 0px;
}

.testo::-webkit-scrollbar-thumb {
  background-color: 000000;
  
}

.testo::-webkit-scrollbar-track {
  background: transparent;
}



/* -------------- BOX GENERALE -------------------------- */


.base { position: relative;
                width: 480px; 
                height: 600px;
                margin-left: 5px; 
                }


/* --------------- IMMAGINE ------------------ */
.immi {
               position: relative;  
               width: 200px; 
               height: 738px;
               background-image: url(https://i.imgur.com/LUhJuP4.png); border: 1px solid #000000;}

/* --------------- TESTI --------------- */


.box1 { position: relative;  z-index: 3; overflow:  hidden;
  width: 230px;
  height: 500px;
  margin-left: 210px; 
  margin-top: -714px;  
  border: 1px solid #000000;
  padding: 3px; 
  transition: all ease-out 1.5s; 
}


.testo { position: absolute; z-index: 2; float: left; overflow: auto;
  width: 220px;
  height: 490px;
  padding: 5px;
  background-color: #000000; 
  text-align: justify; 
  color: #3d3d3d; 
  font-family: "Titillium Web", sans-serif; 
  font-size: 10.5px; 
  line-height:11px; 
  letter-spacing: 1px; 
  font-weight: normal!important;
}


/* ------------------- NOME GRANDE ------------------------------ */
.frase { z-index: 4;
	            position: relative;
	            margin-left: 30px;
              margin-top: -150px;
              font-size: 50px;
              width: 370px;
	            color: #6a6b4f;
	            font-family: "Anton", sans-serif;
	            transition: 5s;
              letter-spacing:-4px;
              text-shadow: 1px 1px 1px #000000; }

.frase1 { position:relative; margin-top: -10px; margin-left: 20px; width:390px; color:#000000; font-family: "Titillium Web", sans-serif; background-color: rgba(50,56,63, .5); font-weight:bold;letter-spacing:2px; text-transform:uppercase; z-index: 4; font-size:8px;text-align:center;text-shadow:1px 1px 1px #000;}
   

/* ---------------- GIF ----------------------- */

.gif1 { z-index: 3;
        position: relative;
        margin-top: -105px;
        margin-left: 260px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/97WpqvG.gif);
        outline: 4px double #000000; filter: brightness(80%)grayscale(80%); }

.gif2 { z-index: 3;
        position: relative;
        margin-top: -67px;
        margin-left: 351px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/VKw1QyX.gif); outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}

.gif3 { z-index: 2;
        position: relative;
        margin-top: -4px;
        margin-left: 246px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/SmXRjvD.gif); outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}

.gif4 { z-index: 3;
        position: relative;
        margin-top: -67px;
        margin-left: 338px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/NezJVOX.gif); 
        outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}


 /* --------------- STYLE SCRITTE --------------- */


a {
     text-decoration:none!important;
}

d {
     color: #b5b054; font-family: georgia; font-size: 9px; line-height: 9px;font-style: italic; font-weight: bold;
}

f {
     font-family: calibri; 
     color: #6a6b4f;
     text-transform: uppercase;
     letter-spacing: 1px;
     font-weight: bold;
     font-size: 8px;
     line-height: 9px!important;
     letter-spacing: 2px; 
}

h {
     font-family: georgia; 
     text-transform: uppercase;
     font-size: 7px;
     line-height: 9px!important;
     letter-spacing: 2px; 
     color: #505f3b;
     opacity: 0.7;
     text-shadow: 1px 1px 0px #111; 
} 

w {
     text-transform: uppercase;
     font-size: 8px;
     line-height: 9px!important;
     letter-spacing: 2px; 
     color: #000000; 
     background: rgb(106, 107, 79, 0.5); 
     padding-left:7px;
     padding-right:7px;
} 


/* ------------------------------ B - I - U - S ------------------------------ */
a {
            color: #555;
            font-size: 10px;
            -webkit-transition: all 1.5s ease-in-out;
    -o-transition: all 1.5s ease-in-out;
    transition: all 1.5s ease-in-out;
     -webkit-backface-visibility: hidden;
        }

        a:hover {
            color: rgba(72,61,139, 0.747);
            -webkit-transition: all 1.5s ease-in-out;
    -o-transition: all 1.5s ease-in-out;
    transition: all 1.5s ease-in-out;
     -webkit-backface-visibility: hidden;
        }

b, i, u, s {
     color: #444;
}


u {
     text-decoration: underline dashed #7b8a9d; 
     line-height: 9px;
}

</style>


<div class="base">
<div class="immi"></div>

<div class="frase">Tobias Elijah Creed</div><div class="frase1">La più grande libertà è quella che ti tiene in catene</div>

<div class="gif1"></div>
<div class="gif2"></div>
<div class="gif3"></div>
<div class="gif4"></div>


<div class="box1"><div class="testo">E' il <w>frutto perfetto</w> della brutalità di un mondo stravolto dai Cordyceps. Nato il 9 gennaio 2010 nel degrado periferico di una città implosa sotto la pandemia, ha visto la sua famiglia sgretolarsi -pezzo dopo pezzo- tra fame, violenza e tradimento. Quando la FEDRA ha militarizzato la città trasformandola in un bastione della sopravvivenza, ha capito che <h>l'umanità è un lusso per chi può permetterselo</h>. || <f>Sometimes human places, create inhuman monsters</f> || Durante l'addestramento base mostra una naturale inclinazione alla <f>spietatezza</f>. Dove gli altri cedono, lui stringe i denti. Dove molti vengono spezzati, lui resta in piedi. Viene indirizzato, per questo, verso un settore dove talento e crudeltà si fondono: <w>interrogatorio e tortura psicologica</w>. La sua fama interna cresce nel silenzio. E' temuto per ciò che dice, non solo per quello che fa. || <f>L’uomo guardò il condannato e chiese all’ufficiale: lui conosce la sua condanna? No – disse l’ufficiale – la conoscerà sul suo stesso corpo.</f> || Tobias agisce con logica glaciale e la sua crudeltà non nasce dall’ira ma da una <d>disciplina spietata</d>. Il suo corpo non è un tempio, <h>ma uno strumento da dominare</h>. La sofferenza è parte dell’equazione. Prevista. Misurata. Tollerata. Non teme il dolore perché l’ha trasformato in metodo. Non teme la morte perché la maneggia ogni giorno sugli altri, ma anche – e soprattutto – su sé stesso. || <f>Al mondo non importa se muori. Non ascolterà le tue urla. Non importa che tu sia ferito. Se SANGUINI a terra, la terra berrà il tuo sangue.</f> || L'arrivo a Boston non viene accompagnato da specifiche particolari ma i fedeli del Generale Boeing lo accolgono come un'opera d'arte. Un <w>veleno a lento rilascio</w> che si infiltra nella QZ scavandone il tessuto sociale. I suoi sono incarichi sporchi, al limite dell'umano. E' la lama dietro al sorriso dei funzionari. Il carceriere che fa parlare anche chi ha già smesso di credere in qualcosa. || <f>E se Dio ha creato un mondo di tale meraviglia per condirlo di mostri, la ragione è una sola</f>: <w>NON L’HA FATTO PER NOI</w>.

   </div></div>



</div>