PDF No Limits by @mariobruz - Codewith.it

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

Referenze

<b>Formatta il testo in grassetto
disabledImpedisce la modifica di un input
selectedPre-seleziona un elemento di input
hreflangConsente di dichiarare la lingua del documento collegato.
_selfApre collegamenti ipertestuali nella stessa pagina del browser
srcIndica la provenienza di una risorsa esterna (tramite URL).

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

copia di follow

La cicala e la formica

Curriculum html

Simulatore di Circuiti AC

questa sarà una pagina web dedic

Weather Forecast

La Storia di Cappuccetto Rosso (2)

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="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;
}