San Valentino ❤️ by @Ciaramid06 - Codewith.it

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

Referenze

_topApre collegamenti ipertestuali nell'elemento parent assoluto
getDefinisce un metodo di invio di dati al server
<a>Inserisce link e collegamenti ipertestuali
<b>Formatta il testo in grassetto
<div>Crea contenitori generici o sezioni in una pagina
<table>Tag primario per la creazione di tabelle

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Creazione Preventivi Online | Serv

Kladdkaka - Ricetta Torta al Ciocc

Countdown fine anno

Tabella Landing page

esercitazione4.html(2)

borghi d-italia

La Magica Storia del Basket Moderno

Portfolio Web Developer

esercizio indice di un libro

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="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>San Valentino ❤️</title>
    <style>
        body {
            margin: 0;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            background: linear-gradient(135deg, #ff9a9e, #fad0c4);
            font-family: 'Arial', sans-serif;
            color: #333;
        }

        .container {
            text-align: center;
        }

        .question {
            font-size: 1.8rem;
            margin-bottom: 20px;
        }

        .buttons {
            display: flex;
            justify-content: center;
            gap: 20px;
        }

        .button {
            padding: 10px 20px;
            font-size: 1.2rem;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .button#think {
            background-color: #ffa502;
            color: #fff;
        }

        .button#love {
            background-color: #ff6b6b;
            color: #fff;
            transform: scale(1);
        }

        .button#love.grow {
            transform: scale(1.2);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="question">Mi ami?</div>
        <div class="buttons">
            <button class="button" id="love">Ti amo ❤️</button>
            <button class="button" id="think" onclick="growLoveButton()">Fammi pensare...</button>
        </div>
    </div> 

    <script>
        let growCounter = 0;
        const loveButton = document.getElementById('love');

        function growLoveButton() {
            growCounter++;
            loveButton.style.transform = `scale(${1 + growCounter * 0.2})`;
        }
    </script>
</body>
</html>