Надо просто создать html файл, который содержит такую таблицу и выводить его через iframe (Зачем???)
Саму таблицу можно сделать через <table> указывая у td colspan и rowspan
Или используя grid c grid-template-areas:
Вот так начать можно
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style>
.tab{
width: 800px;
border: 2px black solid;
padding: 3px;
grid-template-columns: repeat(10,1fr);
display: grid;
grid-template-areas:
'inf inf inf km3 km4 km5 km5 km5 km9 km9'
'km1 km2 km2 km3 km4 km6 km7 km8 km9 km9'
'km10 km10 km10 km11 km12 km13 km13 km13 . .';
}
.tab > div {
margin: 4px;
padding: 8px;
border: 1px black solid;
}
.inf {grid-area: inf;}
.km1 {grid-area: km1;}
.km2 {grid-area: km2;}
.km3 {grid-area: km3;}
.km4 {grid-area: km4;}
.km5 {grid-area: km5;}
.km6 {grid-area: km6;}
.km7 {grid-area: km7;}
.km8 {grid-area: km8;}
.km9 {grid-area: km9;}
.km10 {grid-area: km10;}
.km11 {grid-area: km11;}
.km12 {grid-area: km12;}
.km13 {grid-area: km13;}
.bgblue {
background-color:#00cccc;
}
</style>
</head>
<body>
<div class="tab">
<div class='inf bgblue'>Информатика 10А</div>
<div class='km1'> Комната 1 </div>
<div class='km2'> Комната 2 </div>
<div class='km3'> Комната 3 </div>
<div class='km4'> Комната 4 </div>
<div class='km5'> Комната 5 </div>
<div class='km6'> Комната 6 </div>
<div class='km7'> Комната 7 </div>
<div class='km8'> Комната 8 </div>
<div class='km9 bgblue'> Комната 9 </div>
<div class='km10'> Комната 10 </div>
<div class='km11'> Комната 11 </div>
<div class='km12'> Комната 12 </div>
<div class='km13'> Комната 13 </div>
</div>
</body>
</html>