Mam nadzieję, że pomogłem :)
Skrypt:
function tabliczka()
{
var ile = parseInt( document.getElementById("input").value )
var content = document.getElementById("content")
//jeżeli byśmy w pętli dodawali <td>...<td> to innerHTML by od razu zamykał <tr> i tabelka by nie powstała
//dlatego przechowuję wszytko w stringu i dodaje po pętli w innerHTML
var row = "<td></td>" //jedna pusta komórka
//generowanie wiersza nagłówkowego
for( var i = 1; i <= ile; i++ )
{
row += "<th>" + i + "</th>"
}
content.innerHTML = row
//generowanie pozostałych wierszy
for( var i = 1; i <= ile; i++ )
{
//kolumna nagłówkowa
row = "<th>" + i + "</th>"
//dla każdego wiersza (var i) generowanie (var ile) kolumn (komórek)
for( var j = 1; j <= ile; j++ )
{
row += "<td>" + i*j + "</td>"
}
content.innerHTML += "<tr>" + row + "</tr>"
}
}
HTML umieszczony w załączniku jako zdjęcie (jako że nie można wstawiać znaczników html do odpowiedzi)
Przykładowy css:
td,th
{
width: 50px; height: 50px;
text-align: center;
vertical-align: middle;
}
th{background-color: red}
td{background-color: tomato}
EDIT: wstawiam jeszcze screena jak to u mnie wygląda
