Epic Read - Recensioni di libri fa by @daniele - Codewith.it

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

References

<cite>Inserisce citazioni e menzioni riguardo un'opera creativa.
<canvas>Tag per disegnare grafica dinamica su pagine web.
methodDetermina il metodo di invio dei dati di un form al server
sizeDetermina le dimensioni dell'elemento in base al valore contenuto
listCollega un elemento input con una lista di opzioni datalist
mediaSpecifica a quale dispositivo/display/documento è ottimizzata una risorsa.

Users

Log in to search for users

Explore

Find inspiration

Un Giorno a Napoli: Itinerario Det

La prima pagina

Esercizio tabella

tabella con foto e collegamenti ip

Orologio Analitico

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.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Epic Read - Recensioni di libri fantasy</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        body {
            font-family: 'Roboto', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f9f9f9;
            color: #333;
            line-height: 1.6;
        }
        header {
            background-color: #333;
            color: #fff;
            padding: 10px;
            text-align: center;
        }
        .logo {
            font-size: 25px;
            font-weight: bold;
        }
        nav {
            background-color: #666;
            padding: 10px;
            text-align: left;
        }
        nav ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: left;
        }
        nav ul li {
            margin: 0 5px;
            position: relative;
        }
        nav ul li a {
            color: #fff;
            text-decoration: none;
            padding: 3.5px;
            display: block;
            transition: all 0.3s ease;
        }
        nav ul li:hover > ul {
            display: block;
        }
        nav ul ul {
            display: none;
            position: absolute;
            top: 100%;
            background-color: #666;
            padding: 10px 0;
            width: 100%;
            left: 0;
        }
        nav ul ul li {
            margin: 0;
        }
        nav ul ul li a {
            padding: 10px;
        }
        nav a:hover {
            text-decoration: underline;
        }
        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 0 20px;
            display: flex;
            flex-direction: column; /* Imposta la direzione della flessione a colonna */
        }
        .post {
            background-color: #fff;
            padding: 30px;
            margin-bottom: 40px;
            border-radius: 5px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            text-align: left;
            width: 75%;
            border-left: none; /* Rimuove il bordo sinistro */
            margin-left: 0; /* Imposta il margine sinistro a 0 */
        }
        .post:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        }
        .post h2 {
            color: #333;
            margin-bottom: 10px;
        }
        .post p {
            color: #666;
            margin-bottom: 20px;
        }
        .rating {
            color: #f39c12;
        }
        .fa-star {
            color: #f39c12;
        }
        .post-image {
            margin-bottom: 20px;
            text-align: center;
        }
        .post-image img {
            max-width: 100%;
            border-radius: 5px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        footer {
            background-color: #333;
            color: #fff;
            text-align: center;
            padding: 20px;
            position: fixed;
            bottom: 0;
            width: 100%;
        }
    </style>
</head>
<body>
    <header>
        <div class="logo">Epic Reader</div>
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li>
                    <a href="#">Recensioni</a>
                    <ul>
                        <li><a href="#">Fantasy</a></li>
                        <li><a href="#">Fantascienza</a></li>
                        <li><a href="#">Horror</a></li>
                    </ul>
                </li>
                <li><a href="#">Contatti</a></li>
            </ul>
        </nav>
    </header>
    <div class="container">
        <div class="post">
            <div class="post-image">
                <img src="https://via.placeholder.com/600x400" alt="Immagine libro fantasy">
            </div>
            <h2>Recensione: Il Signore degli Anelli</h2>
            <p>Autore: J.R.R. Tolkien</p>
            <p class="rating"><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i> 5/5</p>
            <p>Il Signore degli Anelli è un romanzo epico fantasy ambientato in un mondo immaginario creato da Tolkien. È considerato uno dei capolavori della letteratura fantastica.</p>
        </div>
        <div class="post">
            <div class="post-image">
                <img src="https://via.placeholder.com/600x400" alt="Immagine libro fantasy">
            </div>
            <h2>Recensione: Harry Potter e la Pietra Filosofale</h2>
            <p>Autore: J.K. Rowling</p>
            <p class="rating"><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star-half-alt"></i><i class="far fa-star"></i> 4.5/5</p>
            <p>Harry Potter e la Pietra Filosofale è il primo romanzo della serie di Harry Potter. Narra le avventure del giovane mago Harry Potter e dei suoi amici.</p>
        </div>
        <!-- Aggiungere altre recensioni qui -->
    </div>
    <footer>
        <p>&copy; 2024 Epic Read - Tutti i diritti riservati.</p>
    </footer>
</body>
</html>