versi\u00f3 millorada del teu fitxer HTML perqu\u00e8 sigui responsive i s’adapti a diferents mides de pantalla i dispositius:<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"ca\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Calculadora<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n margin: 0;\n padding: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n background-color: #f0f0f0;\n }\n .container {\n background-color: #fff;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n max-width: 400px;\n width: 100%;\n }\n h1 {\n text-align: center;\n color: #333;\n }\n label {\n display: block;\n margin-bottom: 5px;\n color: #555;\n }\n input[type=\"text\"], select {\n width: 100%;\n padding: 10px;\n margin-bottom: 10px;\n border: 1px solid #ccc;\n border-radius: 5px;\n }\n input[type=\"submit\"] {\n width: 100%;\n padding: 10px;\n background-color: #007bff;\n border: none;\n border-radius: 5px;\n color: #fff;\n font-size: 16px;\n cursor: pointer;\n }\n input[type=\"submit\"]:hover {\n background-color: #0056b3;\n }\n #resultat {\n color: blue;\n font-weight: bold;\n font-size: 1.5em;\n text-align: center;\n margin-top: 10px;\n }\n <\/style>\n <script>\n function calcular() {\n var num1 = parseFloat(document.getElementById('num1').value);\n var num2 = parseFloat(document.getElementById('num2').value);\n var operacio = document.getElementById('operacio').value;\n var resultat;\n\n if (operacio == '1') {\n resultat = num1 + num2;\n } else if (operacio == '2') {\n resultat = num1 - num2;\n } else if (operacio == '3') {\n resultat = num1 * num2;\n } else if (operacio == '4') {\n resultat = num1 \/ num2;\n } else {\n resultat = \"Elecci\u00f3 inv\u00e0lida\";\n }\n\n document.getElementById('resultat').innerText = \"Resultat: \" + resultat;\n return false; \/\/ Evita que el formulari s'envi\u00ef\n }\n <\/script>\n<\/head>\n<body>\n <div class=\"container\">\n <h1>Calculadora b\u00e0sica<\/h1>\n <form onsubmit=\"return calcular();\">\n <label for=\"num1\">N\u00famero 1:<\/label>\n <input type=\"text\" id=\"num1\" name=\"num1\"><br><br>\n <label for=\"num2\">N\u00famero 2:<\/label>\n <input type=\"text\" id=\"num2\" name=\"num2\"><br><br>\n <label for=\"operacio\">Operaci\u00f3:<\/label>\n <select id=\"operacio\" name=\"operacio\">\n <option value=\"1\">Suma<\/option>\n <option value=\"2\">Resta<\/option>\n <option value=\"3\">Multiplica<\/option>\n <option value=\"4\">Divideix<\/option>\n <\/select><br><br>\n <input type=\"submit\" value=\"Calcular\">\n <\/form>\n <p id=\"resultat\"><\/p>\n <\/div>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\nMillores realitzades:<\/h3>\n\n\n\n\n- Meta tag <\/strong>
viewport<\/code>: Afegit per assegurar que la p\u00e0gina s’adapti correctament a diferents mides de pantalla.<\/li>\n\n\n\n- Estils CSS<\/strong>: Millorat l’estil per fer que la p\u00e0gina sigui m\u00e9s atractiva i responsive.<\/li>\n\n\n\n
- Contenidor centralitzat<\/strong>: Utilitzat un contenidor
.container<\/code> per centrar el contingut i aplicar estils de disseny.<\/li>\n\n\n\n- Estils d’entrada i botons<\/strong>: Millorat l’estil dels camps d’entrada i botons per fer-los m\u00e9s atractius i f\u00e0cils d’utilitzar en dispositius m\u00f2bils.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"
versi\u00f3 millorada del teu fitxer HTML perqu\u00e8 sigui responsive i s’adapti a diferents mides de pantalla i dispositius: Millores realitzades:<\/p>\n","protected":false},"author":2,"featured_media":8179,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-15775","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bloc-de-notes"],"_links":{"self":[{"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/posts\/15775","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.beseit.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=15775"}],"version-history":[{"count":1,"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/posts\/15775\/revisions"}],"predecessor-version":[{"id":15776,"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/posts\/15775\/revisions\/15776"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.beseit.net\/index.php?rest_route=\/wp\/v2\/media\/8179"}],"wp:attachment":[{"href":"https:\/\/www.beseit.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=15775"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.beseit.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=15775"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.beseit.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=15775"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}