36

テキストと画像を隣り合わせにしたいのですが、画像を画面の左端に配置し、テキストを画面の右端に配置したいと考えています。これは私が現在持っているものです....

<body>
<img src="website_art.png" height= "75" width= "235"/>
<h3><font face="Verdana">The Art of Gaming</font></h3>
</body>

これどうやってするの？

ありがとう

4

3 に答える 3

38 
img {
    float:left;
}
h3 {
    float:right;
}

jsFiddle の例

clear:bothフローティング要素の真下にスライドアップしないように、提供したコードの後に​​来るすべての要素でスタイルを使用することをお勧めします。

于 2013-06-20T17:15:31.773 に答える
7

これにcss floatを使用したい場合は、コードに直接配置できます。

<body>
<img src="website_art.png" height= "75" width="235" style="float:left;"/>
<h3 style="float:right;">The Art of Gaming</h3>
</body>

しかし、css の基本を学び、すべてのスタイリングを別のスタイル シートに分割し、クラスを使用することを強くお勧めします。それは将来あなたを助けるでしょう。開始するのに適した場所はw3schools です。または、後で道をたどると、Mozzila Dev になります。ネットワーク (MDN)。

HTML:

<body>
  <img src="website_art.png" class="myImage"/>
  <h3 class="heading">The Art of Gaming</h3>
</body>

CSS:

.myImage {
  float: left;
  height: 75px;
  width: 235px;
  font-family: Veranda;
}
.heading {
  float:right;
}
于 2013-06-20T17:18:23.897 に答える
0

Vertical-align とフローティングを使用できます。

ほとんどの場合、垂直方向に配置する必要があります: 中央の画像です。

ここにテストがあります: http://www.w3schools.com/cssref/tryit.asp?filename=trycss_vertical-align

垂直整列: ベースライン|長さ|サブ|スーパー|トップ|テキストトップ|ミドル|ボトム|テキストボトム|初期|継承;

middle の定義は次のとおりです。要素は親要素の中央に配置されます。

そのため、要素内のすべての要素にそれを適用したい場合があります。

于 2017-02-02T17:49:51.607 に答える