制作中のバンドのサイト。
http://thebbboogie.com
画面右上に、にょきっ～と出てるギター画像。
横幅の狭いスマホやPCで見るとギターが画面左上のロゴにかぶってしまいます。
ギターのサイズが、そこそこあるからインパクトがあるので小さくしたくありません。
横幅がせまくなった時だけロゴにかぶらないよう、小さくしたいのです。
media queryでやろうと思いましたが、別の方法（CSS）でも出来るみたいなので,そっちで
やってみました。わりと簡単ですよ。
HTML
|
1 |
<div id="guitar" class="resizeimage"><img src="画像のパスを指定" alt=""></div> |
CSS
|
1 2 |
#guitar.resizeimage { width:30%; } #guitar.resizeimage img { width: 100%; } |
このケースのマークアップのimg要素は、文脈とは無関係の「装飾目的」なので、altは空文字列でしょう。
つまり alt=”” です。
この投稿の説明用だったのかもしれませんが、それならば、img要素の上にコメントで補足する方が妥当です。
良い機会なので、img の alt の仕様について、再度確認しましょう。
HTML5: img 要素の alt 属性 の仕様
タカハシ先生。
alt=”” に変更しておきました。ついでに画像のパスについても変更しておきました。