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

downloadConsente di scaricare file al click di collegamento ipertestuale.
hrefDefinisce l'URL della risorsa/pagina di destinazione.
<map>Inserisce immagini mappa cliccabili in un documento
autocompleteIndica l'opzione di auto completamento delle aree di input e/o di un form
<tfoot>Definisce il footer o sezione inferiore di una tabella.
<!doctype>Dichiara la versione del linguaggio di sviluppo della pagina

Users

Log in to search for users

Explore

Find inspiration

Page not found - Codewith.it

provo copia prof

esercizio gattino

Condizione esercizio 1

Tabelle con inserimento immagini

Perch Oslo una Smart City 1

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>