モバイルCSSコードの問題

Question

私は自分のサイトのモバイル版を作成しようとしています。

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

そして、この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; 
} 

ここで「バナー」のためのコードです。書かれたものはすべて無視されますが、aを削除すると正常に動作します。しかし、<img>が<a>で囲まれている場合にのみ、それを行う必要があります。なぜそれは動作しませんか？

Answer 1

#banner img aは「idを持つ要素に含まれるIMG要素に含まれる要素が* バナーを」を意味します。

あなたが望むもの： img要素を選択したい場合。

Answer 2

スタイルを適用するHTML要素の間にカンマを置いておきたいと思います。代わりに#banner img, a{ ... }を試してください。