PDF No Limits by @mariobruz - Codewith.it

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

Referenze

idIdentifica univocamente un elemento HTML
_topApre collegamenti ipertestuali nell'elemento parent assoluto
checkedPre-imposta su 'true' il valore di un elemento input checkbox o radio
<link>Collega il documento corrente con una risorsa esterna
<select>Usato per creare un menu a tendina.
relServe a definire la relazione tra il documento e una risorsa.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

match html tags

copia dicountdownfineanno

Curriculum definitivo

Scheda Tecnica Xiaomi 14 Ultra

Menu a tendina CSS

poccodio inserimenti immagineee

sanchez ximena html 3

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