![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
A 回答 (4件)
- 最新から表示
- 回答順に表示
![](http://oshiete.xgoo.jp/images/v2/common/profile/M/noimageicon_setting_12.png?5a7ff87)
No.4
- 回答日時:
IMGタグをDIVタグで括っている事は、スタイル付けに直接は関係ありません。
IMGタグにclass属性を指定し、スタイル付けを行うことは可能です。何故、DIVタグなどで括るサイトが多いかというと「IMGタグはインライン要素であり、ブロック要素内に配置する仕様だから」です。
○仕様に準拠している
<body>
<div><img src="..." width="10" height="10" alt="any"/></div>
<p>ああああ</p>
</body>
×仕様に準拠していない
<body>
<img src="..." width="10" height="10" alt="any"/>
<p>ああああ</p>
</body>
冒頭にIMGタグにスタイル付けをすることは可能と書きましたが、以上を踏まえると「インライン要素としてのスタイル付け」が可能です。もし、ブロック要素としてのスタイル付けをおこなう場合には、過剰にDIVタグなどで括る必要はあります。
初心者様ということで簡潔に書いてみました。厳密に知る場合には、参考URLを参照していただくと良いかと思います。
参考URL:http://rikiy.jp/report/css/20070220.html
No.3
- 回答日時:
あくまで推定ですが、Ajax系のライブラリをデザインの出来上がっている既存のサイトに導入するときには
そうなってしまうこともあるかな、と。特定の部分、例えばメニュー部分をスクロールとかフェードアウトとか
させたいときに、新規のDIVで括って、ライブラリで使うIDを振ったり・・・。
No.2
- 回答日時:
たぶん、imgにclassやstyleを付けられることを知らない、「だけ」、だと。
同じような例で、tableにもdiv、ulにもdiv、pにもdiv……、spanにもdiv。div病・div厨と呼ばれています。あと、tableレイアウトから、css思想を理解しないで、形だけcssに移行した場合、1対1で全てにclassが付いていたり、よくあります。いわゆるチップスのソースをそのままコピペするだけなのでdivで括らなくてはならないと思い込んでいたりします。
ご質問でも、上手な使い方もあります。
<img src="image/xxx.gif" class="style">だと1つづつにつけなくてはいけません。
でも
<div class="style"><img src="image/xxx1.gif">とか<img src="image/xxx2.gif">や<img src="image/xxx3.gif">に見られる。</div>
なんてしていたら、
.style img{ホニャララ}
1つですみますね。あくまでhtmlは構造や固まりを考えてマークアップし、cssではそれをうまく生かすようにされている例もあります。
参考にしていいソースと、参考にすると、伝染病に掛かってしまうソースがありますので、今回のような、どうして?と思われることは伝染病に掛からないために非常に有意義です。ちゃんと意味を考えれば、そこdivになってるけど、imgが本来の意味だからimgに付け替えることは同じチップスを使っていてもできますよね。移行大変でしょうが、頑張ってください。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS imgとpを縦・横に中央揃えする 1 2023/01/17 11:30
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript htmlとcssに関する質問です 3 2022/12/06 05:36
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
リンクを知らせる手のマークが...
-
メニュー
-
HTMLタグ記述の方法
-
ボタンをセル内一杯に表示させ...
-
アップロードするとレイアウト...
-
ポップアップウィンドウのサイ...
-
これは相対URLなんですか?
-
jqueryの画像切り替え
-
<img src="00.gif" border="0">...
-
JPEG写真がアップロードされない
-
html言語でホームページ
-
CSSでボックスの位置を変えたと...
-
送信ボタンのたぐについて・・・
-
CSS での画像サイズの上限設定...
-
CSSレイアウトでのimgへのスタ...
-
スタイルシート line-heightの...
-
htmlで画像を2個ずつ並べていき...
-
htmlの文字が縦書きになる
-
個別にリンクの色を変える方法
-
【ヒトの神秘】美男美女から何...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンをセル内一杯に表示させ...
-
リンクを知らせる手のマークが...
-
htmlで画像を2個ずつ並べていき...
-
ポップアップウィンドウのサイ...
-
画像のサイズが変わらない
-
【HTML/CSS】ボタンの枠が伸び...
-
XML画像データををHTMLで簡単に...
-
UDP通信を使うチャットプログラ...
-
リンクを選択したときの青い枠...
-
favicon.ico はもういらない?
-
CSSの左横に隙間ができてしまい...
-
HTMLのIMAGEに。。
-
table で画像をピッタリとくっ...
-
画像とテーブルの隙間をなくす。
-
縦長広告をウェブページの右側...
-
ホームページで画像を横に並べ...
-
リンクをつけた画像をクリック...
-
HTMLは、シングルクォートかダ...
-
サムネイルをマウスオーバーす...
-
c言語を用いて画像の透明度をあ...
おすすめ情報