imgタグとレスポンシブについて
imgタグとレスポンシブについて
imgタグなどのようなインライン要素は、
ブロック要素で囲まないといけないと聞いたのですが、下記のような形でナイトいけないのですよね
下記のように直前にブロック要素で囲まれていないといけないのでしょうか?
<div class="copyright">
<img src="img/base/copyright.png" alt="のコピーライト" width="382" height="24" />
</div>
下記のように直前にブロック要素で囲まれていないといけないのでしょうか?
それとも直接ブロック要素で囲まれていなくてもずっと先にブロック要素があってそこから入れ子になっていればいいのでしょうか?
~
<td class="copyright">
<address>
〒***-*** **県**市**町 1-5-10 <span>TEL.0977-84-****</span>
</address>
<ul class="futtnavi">
<li><a href="http://index.html"><img src="img/base/sitemap.png" alt="サイトマップ" width="101" height="18" /></a></li>
<li><a href="http://index.html"><img src="img/base/sitemap.png" alt="サイトマップ" width="101" height="18" /></a></li>
</ul>
<img src="img/base/copyright.png" alt="会のコピーライト" width="382" height="24" />
</td>
~
下記はだめですよね。
<H2>画像</H2>
<IMG src="img/img0.jpg" width="120" height="90" alt="写真" border="0" align="top">
文字が上揃えになります<BR>
<BR>
<IMG src="img/img1.jpg" width="120" height="90" alt="写真" border="2">
枠の太さを2にしています<BR>
<BR>
<IMG src="img/img2.jpg" w
また、もうひとつになってしまうのですが、下記のimg をフルイドイメージにしたい場合は画像のたて、横はば割る直前のブロック要素のtdのwidthと縦幅(クロームのf12で出てくるpx)で出した%を
ul.futtnavi+img {
width: 67.3%;
height: 18%;
}
のように入れれば良いのですよね。
tdのサイズは567px,133px
imgは382、24です。
うまくぴったりのサイズになりません。
スマホでは消えます。
またtdの中の内容が増えた場合毎回計算しなおさないといけないのでしょうか?
~
<td class="copyright">
<address>
〒***-*** **県**市**町 1-5-10 <span>TEL.0977-84-****</span>
</address>
<ul class="futtnavi">
<ul class="futtnavi">
<li><a href="http://index.html"><img src="img/base/sitemap.png" alt="サイトマップ" width="101" height="18" /></a></li>
<li><a href="http://index.html"><img src="img/base/sitemap.png" alt="サイトマップ" width="101" height="18" /></a></li>
</ul>
<img src="img/base/copyright.png" alt="会のコピーライト" width="382" height="24" />
</td>
お礼
回答、ありがとうございました。とっても解りやすかったです。