0

中央に配置し、間にスペースを入れないようにする 2 つの画像のコードに問題があります。

私は経験が浅く、両方のコードを 1 つにマージする方法がよくわかりません。

画像間のスペースを削除するために使用しているコード:

<div class="row">
<p style="line-height: 0.0em;"><img src="photo1 "/><img src=”photo2” /></p>
</div>

画像を中央に配置するために使用しているコード:

<div id="wrapper" style="width:100%; text-align:center">
<img id="yourimage"/>
</div>

どんな助けでも大歓迎です。

4

3 に答える 3

0

これはあなたが望むものです：

<div class="row" style="text-align: center; font-size: 0;>
    <p style="line-height: 0.0em;">
        <img src="http://placekitten.com/150/100">
        <img src="http://placekitten.com/150/100">
    </p>
</div>

例: http://jsfiddle.net/X7cfw/

繰り返しますが、可能な限りインライン スタイルは避けてください。

于 2013-07-27T04:38:19.593 に答える
0

必要に応じてテーブルも使用できます。

<table>
  <tr>
    <td>
         Image 1
    </td>
    <td>
          Image 2
    </td>
  </tr>
</table>

各 DIV をより適切に制御するには、このアプローチを使用できます

HTML

<div class="container">
    <div class="div1">Div 1</div>
    <div class="div2">Div 2</div>
</div>

CSS

div.container {
    background-color: #FF0000;
    margin: auto;   
    width: 304px;
}

div.div1 {
    border: 1px solid #000;
    float: left;
    width: 150px;
}

div.div2 {
    border: 1px solid red;
    float: left;
    width: 150px;
}

Jsfiddle: http://jsfiddle.net/azXMN/

于 2013-07-27T04:33:19.770 に答える
0

これを試して ：

<div id="wrapper" style="width:100%; text-align:center" class="row">
<p style="line-height: 0.0em;"><img src="photo1 "/><img src=”photo2” /></p>
</div>

または、一方を他方の内側に配置して、内側を画像の中央に配置することも<div>でき<div>ます<div>。

[PS: インライン CSS はできるだけ避けてください。代わりに、CSS をヘッダーまたは外部 CSS ファイルに入れます]

于 2013-07-27T04:33:55.380 に答える