PDF No Limits by @mariobruz - Codewith.it

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

References

autoplayAttributo HTML autoplay per l'avvio automatico degli elementi audio e video
<th>Definisce una cella di intestazione di una tabella HTML.
<input>Definisce un area di input per l'invio di dati e informazioni
<embed>Tag per l'incorporamento di contenuti multimediali
<audio>Il tag <audio> HTML permette di inserire contenuti musicali e suoni nel documento
<caption>Definisce didascalie all'interno di una tabella

Users

Log in to search for users

Explore

Find inspiration

Prep. Esame pt.3

Esercitazione n.1

Appunti Informatica

prova che si muove

Esercizio LISTA

Bootstrap List Grid

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="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>PDF No Limits</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header class="header">
        <a href="#" class="brand">PDF No Limits</a>
        <nav class="menu">
            <a href="#">Unisci PDF</a>
            <a href="#">Dividi PDF</a>
            <a href="#">Comprimi PDF</a>
        </nav>
    </header>

    <main class="content">
        <h1>Benvenuto su PDF No Limits</h1>
        <p>Seleziona un’operazione e carica il tuo file PDF per iniziare.</p>
        <form action="#" method="post" enctype="multipart/form-data">
            <label for="pdf_file">Carica il tuo PDF:</label>
            <input type="file" name="pdf_file" id="pdf_file" required>
            
            <label for="operation">Seleziona Operazione:</label>
            <select name="operation" id="operation">
                <option value="compress">Comprimi PDF</option>
                <option value="merge">Unisci PDF</option>
                <option value="extract">Estrai Pagine</option>
            </select>
            
            <button type="submit">Esegui Operazione</button>
        </form>
    </main>

    <footer class="footer">
        <p>&copy; 2024 PDF No Limits. Tutti i diritti riservati.</p>
    </footer>
</body>
</html>

/* Reset di base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #f8f9fb;
    color: #333;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.header {
    background-color: #0073e6;
    padding: 10px;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.brand {
    font-size: 1.5em;
    color: white;
    text-decoration: none;
}

.menu a {
    color: white;
    margin: 0 10px;
    text-decoration: none;
}

.content {
    flex: 1;
    max-width: 600px;
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
    text-align: center;
}

h1 {
    font-size: 2em;
    color: #0073e6;
}

form {
    margin-top: 20px;
}

label {
    display: block;
    margin-top: 10px;
    font-weight: bold;
}

input[type="file"], select {
    width: 100%;
    padding: 8px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

button {
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #0073e6;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1em;
}

button:hover {
    background-color: #005bb5;
}

.footer {
    text-align: center;
    padding: 10px;
    background-color: #0073e6;
    color: white;
}