JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div class="Bild">
        <img src="http://lorempizza.com/250/80" alt="logo" width="250px" height="80px" />
    </div>
    <br>
    <div class="center">
        <ul id="navigation">
            <li><a href="Start.html" target="startseite">Startseite</a>
            </li>
            <li><a href="Kategorien/Rock.html" target="startseite">Rock</a>
            </li>
            <li><a href="Kategorien/Schlager.html" target="startseite">Schlager</a>
            </li>
            <li><a href="Kategorien/Hip-Hop.html" target="startseite">Hip-Hop</a>
            </li>
            <li><a href="Kategorien/Electro.html" target="startseite">Electro</a>
            </li>
            <li><a href="Kategorien/Trap.html" target="startseite">Trap</a>
            </li>
        </ul>
        <br>
        <div align="center">
            
            <body>
                <center>
                    
<h1><b> Herzlich Willkommen bei CBA.de </b></h1>
                </center>
                <hr>
                
<h3>Hier unsere Top 10 Alben f&uuml;r diese Woche: </h3>

                <table>
                    <tr>
                        <td> <a href="Kategorien/Trap/DoOrDie.html"><img src="http://lorempixel.com/200/150" alt="Produktbild" width="200px" height="150px"/></a> 
                        </td>
                        <td> <a href="Kategorien/Trap/Blood.html"><img src="http://lorempixel.com/200/150/abstract" alt="Produktbild" width="200px" height="150px"/></a> 
                        </td>
                        <td> <a href="Kategorien/Trap/Wooh.html"><img src="http://lorempixel.com/200/150/nightlife" alt="Produktbild" width="200px" height="150px"/></a> 
                        </td>
                        <td><a href="Kategorien/Schlager/helene.html"><img src="http://lorempixel.com/200/150/people" alt="Produktbild" width="200px" height="150px"/></a>
                        </td>
                    </tr>
                    <tr>
                       ...

CSS

/*
#FE9A2E --> helles orange

#2ECCFA --> helles türkis
*/
 body {
    background:url(bilder/hintergrund.jpg) no-repeat;
    background-size: cover;
}
h1 {
    color: white;
    font-size: 15px;
}
UL#navigation LI {
    text-align: center;
    float: left;
    margin-right: 1px;
    width: 166px;
    list-style: none;
}
UL#navigation {
    margin-top: 50px;
    margin-left: 84px;
    text-align: center;
    width: auto;
    float: left;
    margin-bottom: 7px;
}
UL#navigation LI A {
    text-align: center;
    background-color: #097AEC;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding: 10px;
}
UL#navigation A:HOVER {
    background-color:#2ECCFA;
    color:#fff;
}
iframe {
    height: 1000px;
    width: 1000px;
    margin: 0;
    padding: 0;
    background-color: white;
    border: 0;
}
.center {
    text-align: center;
}
.login {
    color: white;
    margin-left: 1000px;
    height: 50px;
    width: 350px;
    position: absolute;
}
a:link {
    color: white;
}
a:active {
    color: white;
}
a:hover {
    color: #2ECCFA;
}
a:visited {
    color: white;
}
body {
    font-family:arial;
    background-color: white;
}
UL#navigation LI {
    float: left;
    margin-right: 1px;
    width: 200;
    list-style: none;
}
UL#navigation {
    width: 615px;
    float: left;
    margin-bottom: 5px;
}
UL#navigation LI A {
    text-align: center;
    background-color:#097AEC;
    color: #fff;
    font-weight: bold;
    text-decoration:none;
    display: block;
    padding: 10px;
}
UL#navigation A:HOVER {
    background-color:#2ECCFA;
    color:#fff;
}
iframe {
    height: 1000px;
    width: 1000px;
    margin: 0;
    padding: 0;
}
a:link {
    color: black;
}
a:visited {
    color: green;
}