Untitled

<html>
    <head>
        <title>La prima pagina html</title>
        <style>
            .testo{
                color:red;
                
            }
            h1{
                color:blue;
                font-size:60px;
            }
            
            #immagine{
                color:yellow;
                width: 200px;
            }
            .black{
                background:black;
            }
        </style>
    </head>
    <body>
          <button id="pulsante" >
              Clicca qui
          </button>
          <h1 class="testo black" id="immagine" style="color:violet">titolo della pagina</h1>
          <br>
          <p class="testo">Questo è un paragrafo</p>
          <img id="immagine" src="https://www.zooplus.it/magazine/wp-content/uploads/2020/05/1-4.jpg" alt="">
    <script>
        function clickButton(){
            alert('hai cliccato il bottone');
        }
        function funzione2(){
            let btn = document.getElementById('pulsante');
            btn.innerText = "Dai clicca veramente!";
        }
        function funzione1(){
            let btn = document.getElementById('pulsante');
            btn.innerText = "Clicca qui!";
        }

        var btn = document.getElementById('pulsante');
        btn.addEventListener("click", clickButton);
        btn.addEventListener("mouseover", funzione2);
        btn.addEventListener("mouseout", funzione1);

    </script>
    </body>
</html>
Editor is loading...