私のページには2つの画像があります。ユーザーがタッチ デバイスを使用して、または Javascript をサポートしていない Web サイトにアクセスしたときに、Modernizr を使用してそれらをターゲットにすることで、最初の 1 つが表示されるようにします。
ページ上部のメニュー ボタン:
<img src="menubutton.png" alt="Menubutton">
もう 1 つの画像は、記事で使用されている単なる画像です。
<img src="image.jpg" alt="Image">
私のCSSには、これがあります：
.no-touch img:first-of-type, .no-js img:first-of-type {
display:none;
}
現在、これはほとんど問題なく機能しています。画像はラップトップでは表示されませんが、iPad では表示されます。しかし、2 番目の画像も私のラップトップには表示されません。ただし、その 2 番目の画像は iPad に表示されています。また、ID を使用して最初の画像をターゲットにすると、思いどおりに動作しますが、本当に必要でない限り ID を使用できません。ここで何が起こっているのですか？