<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calculadora de Volume</title>
<script>
function calcularVolume() {
var largura = parseFloat(document.getElementById("largura").value);
var altura = parseFloat(document.getElementById("altura").value);
var comprimento = parseFloat(document.getElementById("comprimento").value);
var passos = document.getElementById("passos");
var resultado = largura * altura * comprimento;
passos.innerHTML = "Passo a passo:<br>";
passos.innerHTML += "V = largura x altura x comprimento<br>";
passos.innerHTML += "V = " + largura + " x " + altura + " x " + comprimento + "<br>";
passos.innerHTML += "V = " + (largura * altura) + " x " + comprimento + "<br>";
passos.innerHTML += "V = " + ((largura * altura) * comprimento) + "<br>";
passos.innerHTML += "V = " + resultado + " cm³";
document.getElementById("resultado").innerHTML = "Volume: " + resultado + " cm³";
}
</script>
</head>
<body>
<h1>Calculadora de Volume</h1>
<label for="largura">Largura:</label>
<input type="number" id="largura"><br><br>
<label for="altura">Altura:</label>
<input type="number" id="altura"><br><br>
<label for="comprimento">Comprimento:</label>
<input type="number" id="comprimento"><br><br>
<button onclick="calcularVolume()">Calcular</button><br><br>
<div id="passos"></div><br>
<div id="resultado"></div>
</body>
</html>