<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>tablas de multiplicación</title>
</head>
<body class="body">
<style>
.body {
background-color: azure;
margin: 20px;
}
.titulo {
color: coral;
font-size: 1em;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.parrafo {
color: black;
font-size: 0.7em;
font-family: Arial, Helvetica, sans-serif;
}
</style>
<script>
/*----- Pinta la tabla de multiplicación del 8 ------ */
var tablaMultiplicacion = 8;
document.write("<h4 class='titulo'> Tabla de multiplicación del " + tablaMultiplicacion + ": </h4>");
for (var i = 1; i <= 10; i++) {
var resultado = (tablaMultiplicacion * i);
document.write("<p class='parrafo'>" + tablaMultiplicacion + " X " + i + " = " + resultado);
document.write("<br>");
document.write("---------------------------------");
document.write("<br>");
}
document.write("<br>");
document.write("<h4 class='titulo'>----------------------------- Tablas de multiplicación --------------------------------</h4>");
document.write("<br>");
/*----- Pinta todas las tablas de multiplicar hasta el numero que le digamos ------ */
for (var secuencia = 1; secuencia <= tablaMultiplicacion; secuencia++) {
document.write("<h4 class='titulo'> Tabla de multiplicación del " + secuencia + ": </h4>");
for (var numero = 1; numero <= 10; numero++) {
var resultado = (secuencia * numero);
document.write("<p class='parrafo'>" + secuencia + " X " + numero + " = " + resultado);
document.write("<br>");
document.write("---------------------------------");
document.write("<br>");
}
}
</script>
</body>
</html>
