Mobile CSS Code Probleme

Question

Ich versuche, eine mobile Version meiner Website zu machen. Hier ist der Code für die „Fahne“:

<center> 
    <div id="banner"> 
     <a href="./"><img src="graphics/banner.png" /></a> 
    </div> 
</center> 

Und mit dieser CSS:

#banner img a { 
    background-color: #ccc; 
    border-bottom: 1px solid #666; 
    color: #222; 
    display: block; 
    font-size: 20px; 
    font-weight: bold; 
    padding: 10px 0; 
    text-align: center; 
    text-decoration: none; 
} 

Wenn ich es versuchen, wie, dass es nicht funktionieren wird. Alles, was geschrieben wurde, wird anscheinend ignoriert, aber wenn ich das a entferne, funktioniert es normal. Aber ich brauche es, um das zu tun, wenn die von <a> umgeben ist. Warum wird es nicht funktionieren?

Answer 1

#banner img a bedeutet "Ein ein Element in einem img Element in einem Element mit dem id * Banner enthaltenen enthalten".

Sie möchten: #banner a img, wenn Sie das Element img auswählen möchten.

Answer 2

Ich denke, dass Sie ein Komma zwischen den HTML-Elementen haben möchten, auf die Sie den Stil anwenden möchten. Versuchen Sie stattdessen #banner img, a{ ... }.