9

いろいろなイメージが散りばめられた長文を基本的にスタイリングしています。最初の画像を「float: left」に、2 番目の画像を「float: right」にします。次のように画像のスタイルを設定できることを知っています。

img {
float: left;
}

これにより、各画像が同じスタイルになります。各画像を異なるスタイルにするにはどうすればよいですか? それぞれの画像を別の div クラスに配置して、異なるスタイルを設定できるようにしましたが、うまくいきませんでした。

また、次のように、html タグ内の各画像のスタイルを設定できることも理解しています。

<img src="ABCD.png" alt="Raoul Hausmann's ABCD" align="left" height="300px">

HTML とは別に、外部スタイル シート (CSS) にスタイルを保持するのが最善であるとよく耳にします。これはインライン スタイリングが必要な場合ですか?

4

4 に答える 4

8

次のように、各画像に異なる css を定義するのに役立つクラスまたは ID を各画像に与えることができます。

<img src="" class="image1">
<img src="" class="image2">

cssファイルで定義できます

.image1
{
width:200px;
height:200px;
}
.image2
{
width:300px;
height:300px;
}
于 2014-12-31T09:45:21.740 に答える
2

画像にクラスを与えると、次のようにそのクラスですべての画像のスタイルを設定できます。

.left {
  border: solid 5px red;
  float: left;
}

.right {
  border: solid 5px blue;
  float: right;
}
<img src="ABCD.png" class="left">
<img src="ABCD.png" class="right">

于 2014-12-30T02:09:35.550 に答える