PDF No Limits by @mariobruz - 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.
_topApre collegamenti ipertestuali nell'elemento parent assoluto
crossoriginGestisce richieste tra documenti provenienti da origini differenti.
formenctypeDefinisce il tipo di codifica dei dati di un elemento input
<aside>Definisce un contenuto separato dal testo perincipale
widthImposta la larghezza di un elemento HTML

Users

Log in to search for users

Explore

Find inspiration

navbar responsive

HOTEL STELLA MARIS

infostrumenti.html

spotify dashboard

I giornali online

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