<style>
.kuran-tablosu-wrapper {
width: 100%;
overflow-x: auto; /* Mobilde yatay kaydırma sağlar */
margin: 20px 0;
font-family: Arial, sans-serif;
}
.kuran-tablosu {
width: 100%;
min-width: 800px; /* Tablonun mobilde çok sıkışmasını önler */
border-collapse: collapse;
border: 4px solid black;
text-align: center;
background-color: #fff;
}
.kuran-tablosu th,
.kuran-tablosu td {
border: 2px solid black;
padding: 10px 5px;
color: #000;
font-weight: bold;
}
/* Özel Kalın Kenarlıklar */
.kuran-tablosu .kalin-sag {
border-right: 4px solid black;
}
.kuran-tablosu .kalin-alt {
border-bottom: 4px solid black;
}
/* Renkler ve Yazı Tipleri */
.kuran-tablosu .kirmizi-metin {
color: red;
font-size: 1.1em;
letter-spacing: 1px;
}
.kuran-tablosu .mavi-dikey-metin {
color: #1e4d8c; /* Görseldeki mavi tonu */
writing-mode: vertical-rl;
transform: rotate(180deg);
letter-spacing: 2px;
padding: 20px 5px;
width: 30px;
}
.kuran-tablosu .ay-yil {
font-size: 1.3em;
letter-spacing: 2px;
}
/* Boş Satır Yükseklikleri */
.kuran-tablosu td.bos-hucre {
height: 25px;
}
</style>
<div class="kuran-tablosu-wrapper">
<table class="kuran-tablosu">
<tr>
<th colspan="2" rowspan="2" class="kalin-sag kalin-alt ay-yil">2026<br>MAYIS</th>
<th colspan="4" class="kirmizi-metin kalin-sag">1. HAFTA</th>
<th colspan="4" class="kirmizi-metin">2. HAFTA</th>
</tr>
<tr>
<th class="kalin-alt">4 PZT</th>
<th class="kalin-alt">5 SALI</th>
<th class="kalin-alt">6 ÇRŞ</th>
<th class="kalin-alt kalin-sag">7 PRŞ</th>
<th class="kalin-alt">11 PZT</th>
<th class="kalin-alt">12 SALI</th>
<th class="kalin-alt">13 ÇRŞ</th>
<th class="kalin-alt">14 PRŞ</th>
</tr>
<tr>
<th colspan="2" class="kalin-sag">Sure ve Ayet</th>
<td></td>
<td></td>
<td></td>
<td class="kalin-sag"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td rowspan="14" class="mavi-dikey-metin kalin-sag">ÖĞRENCİ LİSTESİ</td>
<td class="kalin-sag bos-hucre"></td>
<td></td>
<td></td>
<td></td>
<td class="kalin-sag"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
<tr><td class="kalin-sag bos-hucre"></td><td></td><td></td><td></td><td class="kalin-sag"></td><td></td><td></td><td></td><td></td></tr>
</table>
</div>