Kelas jadual tidak boleh dikenali/dibaca dalam html/css

Question

Saya mempunyai jadual yang sepatutnya mempunyai kelas "table-class", tetapi kelas itu tidak diiktiraf/dibaca dan sifatnya tidak muncul dalam jadual. Saya menggunakan azure appServiceEditor dan apabila saya menjalankan kod, output hanyalah helaian gaya lalai supaya atribut class="table-class" tidak dibaca. Tetapi apabila saya memasukkan mana-mana kelas lain dan bukannya "Kelas Jadual", sifatnya ditunjukkan. Saya tidak faham apa masalahnya.

.table-class {
  position: absolute;
  display: block;
  font-family: arial, sans-serif;
  border-collapse: collapse;
  z-index: 10000000;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5%;
  color: white;
}

.table-class td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.table-class tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.6);
}

<table class="table-class">
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
</table>

Answer 1

.table {
  position: absolute;
  display: block;
  font-family: arial, sans-serif;
  border-collapse: collapse;
  z-index: 10000000;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5%;
  color: white;
}

.table td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.table tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.6);
}

Company	Contact	Country
Alfreds Futterkiste	Maria Anders	Germany
Centro comercial Moctezuma	Francisco Chang	Mexico
Ernst Handel	Roland Mendel	Austria
Island Trading	Helen Bennett	UK
Laughing Bacchus Winecellars	Yoshi Tannamuri	Canada
Magazzini Alimentari Riuniti	Giovanni Rovelli	Italy

Gunakan kod ini dan bukannya kelas jadual