WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="style.css"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Calculator</title> </head> <body> <div class="Calculator"> <div class="screen"> </div> <div class="buttons"> <button>AC</button> <button>SHIFT</button> <button>MENU</button> <button>OFF</button> <button>%</button> <button class="button-1">1</button> <button class="button-2">2</button> <button class="button-3">3</button> <button>/</button> <button class="button-4">4</button> <button class="button-5">5</button> <button class="button-8">6</button> <button>X</button> <button class="button-0">7</button> <button class="button-8">8</button> <button class="button-9">9</button> <button>-</button> <button>+</button> <button class="0">0</button> <button>=</button> </div> </div> </body> </html>
body{ background: radial-gradient(rgb(97, 149, 97),blue); height: 1500px; display: flex; justify-content: center; } /*pour la taille du boitier de la calculatrice*/ .Calculator { width: 380px; height: 620px; background-color: black; border-radius: 40px; margin-left: 160px; margin-top: 100px; } /*Pour la modification de l'ecran de la calculatrice */ .screen { background-color: rgb(255, 255, 255); width: 320px; height: 180px; border-radius: 20px; margin-left: 30px; margin-top: 35px; } /*pour la gestion des bouttons*/ button{ height: 50px; width: 50px; margin-top: 40px; border-radius: 14px; flex-wrap: wrap; margin: 13px; margin-left: 25px; color: blue; }
/* Replace with your JS Code (Leave empty if not needed) */
Validating your code, please wait...
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="style.css"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Calculator</title> </head> <body> <div class="Calculator"> <div class="screen"> </div> <div class="buttons"> <button>AC</button> <button>SHIFT</button> <button>MENU</button> <button>OFF</button> <button>%</button> <button class="button-1">1</button> <button class="button-2">2</button> <button class="button-3">3</button> <button>/</button> <button class="button-4">4</button> <button class="button-5">5</button> <button class="button-8">6</button> <button>X</button> <button class="button-0">7</button> <button class="button-8">8</button> <button class="button-9">9</button> <button>-</button> <button>+</button> <button class="0">0</button> <button>=</button> </div> </div> </body> </html>
body{ background: radial-gradient(rgb(97, 149, 97),blue); height: 1500px; display: flex; justify-content: center; } /*pour la taille du boitier de la calculatrice*/ .Calculator { width: 380px; height: 620px; background-color: black; border-radius: 40px; margin-left: 160px; margin-top: 100px; } /*Pour la modification de l'ecran de la calculatrice */ .screen { background-color: rgb(255, 255, 255); width: 320px; height: 180px; border-radius: 20px; margin-left: 30px; margin-top: 35px; } /*pour la gestion des bouttons*/ button{ height: 50px; width: 50px; margin-top: 40px; border-radius: 14px; flex-wrap: wrap; margin: 13px; margin-left: 25px; color: blue; }
/* Replace with your JS Code (Leave empty if not needed) */