Weebflix by @matmat - Codewith.it

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

Referenze

selectedPre-seleziona un elemento di input
<tr>Definisce le righe di una tabella (rows)
autoplayAttributo HTML autoplay per l'avvio automatico degli elementi audio e video
<aside>Definisce un contenuto separato dal testo perincipale
<html>Tag primario di un documento HTML
multipart/form-dataCodifica dei caratteri di un form

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Heads Or Tails Random Tally

portfolio-Davide-Cantore.html

esercitazione5.html

Esercizio tabella spese

Heads Or Tails Random Tally

"esercitazione 6.html"

Coppa del mondo

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="style.css">
    <title>Weebflix</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nerko+One&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>

        
        main{
          display: flex;
          align-items: center;
          flex-direction: column;
        }
        
        nav{
          background-color: silver;
          border: solid 5px black;
          border-radius: 5px;
          margin-top: 50px;
        }
        header{
          width: 90%;
          height: 75px;
        }
        h1{
          padding-left: 20px;
          font-family: "Nerko One", cursive;
          font-weight: 400;
          font-size: 30px;
          font-style: normal;
          font-color: navy;
        }
        .head{
          display: flex;
          background-color: silver;
          height: 100px;
          justify-content: center;
          align-items: center;
          font-family: "Nerko One", cursive;
          font-weight: 400;
        }
        .weebflix{
          font-style: normal;
          font-size: 70px;
          font-color: navy;
        }
        div{
          border: solid 5px navy;
          border-radius: 5px;
          margin: 10px;
          background-color: silver;
        }
        body{
          display: flex;
          flex-direction: column;
          background-color: orange;
          align-items: center;
        }
        .Row1, .Row2{
          display: flex;
          flex-direction: row;
        }
        img{
          width:20%;
        }
        img:hover{
        transform: scale(1.1, 1.1);
        }
        footer{
          display: flex;
          font-family: "Nerko One", cursive;
          font-weight: 400;
          font-size: 30px;
          font-style: normal;
          font-color: navy;
        }
        .footerdiv{
          margin:10px;
        }

       
        .Row1:hover{
        border: solid 10px orange;
        
        }
        .Row2:hover{
        border: solid 10px orange;
        }
        .aaa:hover{
        font-color: orange;
        }
      </style>
    </head>
    <body>
      <main>
      <header>
        <div class="head">
          <p class="weebflix">
            Weebflix
          </p>
          </div>
      </header>
<nav>


  <h1>Summer 2024</h1>
  <div class="Row1">
      <img src="https://m.media-amazon.com/images/M/MV5BZmM1M2E1ZDEtYTZiNy00NzFjLTk2NDUtODExMWM3OWQ2NGU3XkEyXkFqcGdeQXVyNjAwNDUxODI@._V1_.jpg" alt="Oshi No Ko" class="oshi">
      <img src="https://www.nautiljon.com/images/anime/00/56/giji_harem_11865.webp" alt="Pseudo Harem" class="pseudo">
      <img src="https://m.media-amazon.com/images/M/MV5BNjg0YTVjNTItZTI1ZC00MDZlLTllYjQtMDY0ODMxNDdlYjY3XkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg" alt="Alya" class="alya">
      <img src="https://imgsrv.crunchyroll.com/cdn-cgi/image/fit=contain,format=auto,quality=85,width=480,height=720/catalog/crunchyroll/6533e54a54f7a69c806920607bc8238e.jpg" alt="Nokotan" class="nokotan">
      <img src="https://m.media-amazon.com/images/M/MV5BNWU1OTgxYTMtZTViMy00MmU0LTg2ZGMtZDVkYTNlYzI4NWRjXkEyXkFqcGc@._V1_.jpg" alt="Wistoria" class="wistoria">
  </div>
  <h1>Recommendations</h1>
  <div class="Row2">
      <img src="https://m.media-amazon.com/images/M/MV5BN2NlM2Y5Y2MtYjU5Mi00ZjZiLWFjNjMtZDNiYzJlMjhkOWZiXkEyXkFqcGdeQXVyNjc2NjA5MTU@._V1_FMjpg_UX1000_.jpg" alt="Re:Zero" class="zero">
      <img src="https://m.media-amazon.com/images/M/MV5BMjUxMzE4ZDctODNjMS00MzIwLThjNDktODkwYjc5YWU0MDc0XkEyXkFqcGdeQXVyNjc3OTE4Nzk@._V1_FMjpg_UX1000_.jpg" alt="Steins;Gate" class="steins">
      <img src="https://images-na.ssl-images-amazon.com/images/I/81M3xEBt13L.jpg" alt="Elaina" class="elaina">
      <img src="https://m.media-amazon.com/images/M/MV5BNGY0NGM5N2UtNzU5MS00MDAwLWFmMWEtZjE4N2Q0Y2M4YjNjXkEyXkFqcGc@._V1_.jpg" alt="Bocchi" class="bocchi">
      <img src="https://m.media-amazon.com/images/M/MV5BZjM4ODA5YTktNjliMC00NzI5LTk3ZTctZWYyYWEyNTJhMmQzXkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg" alt="Made In Abyss" class="abyss">
  </div>
</nav>
<footer>
  <div class="f">
  <h1></h1>
  <p class="footerdiv"><a href="https://myanimelist.net/" target="_blank" class="aaa">Track Your Anime</a></p>
  </div>
</footer>
</main>
      </body>
</html>