1

似たような問題に関する他の投稿を読みました。しかし、この「やや」は役に立ちません。

場合：

テーブルセルには、親指の写真があります。何も表示せずに左上隅にドッキングします。罰金。それならその写真を参考にした言葉が欲しいです。私が何もしなければ、彼らは写真の真下に整列し、セルの左側に平行になります。

仮説：

写真の下ではなく、右側に単語を並べてほしい。それを取得する方法はありません。

  1. 未知の行数を動的に表示しているため、ページの座標に関連して混乱するため、絶対的な配置を忘れてください。

  2. margin-left、margin-rightなどを使用してそれらを配置しようとすると、どちらも機能しません。理由：町ごとに長さが異なるため、ある単語で問題がないことは、他の単語では問題がありません。

  3. 相対測位を試みても機能しません。理由：ルールによると、相対的なものは、要素の通常の位置に関連して扶養家族を配置します。要素の通常の位置は画像の下に降りることであることがわかりました。そのため、最初の要素に対して要素を配置することはできますが、最初の要素の位置が間違っていることがわかります。したがって、すべての扶養家族は次のようになります。それも。

marging-rightなどを使用して、最初の要素を必要な場所に配置すると、他の要素の相対的な配置は機能しません。これは、必要な位置が、単語がドキュメント内でそれ自体を配置する位置ではないためです。

私はこの要素を持っています：写真以外の要素である写真価格の町の地域

<tr class=<?php  echo $fila?>>


<td>
<?php echo "<img src= http://localhost/housing2/assets/uploads/thumbs/$oferta->thumb_a>"?>

<ul>

<li>
<div id ="listado"><?php echo $oferta->price?></div>
</li>

<li class = "listado.town">
<div id ="listado_town" ><?php echo $oferta->nombre_localidad?></div>
</li>

<li class = "listado.region">
<div id ="listado_region"><?php echo $oferta->nombre_region?></div>
</li>

<li class = "listado.m2">
<div id ="listado_metros" ><?php echo $oferta->m2?></div>
</li>

</ul>


</td>

とcss

.listado.town{position:relative; bottom:10px;}
.listado.region{position:relative;bottom:15px;}
.listado.m2{position:relative;bottom:20px;}

しかし、これは私が試した20回の出来事の1つにすぎません。これは、画像の下と左側にすべての要素を配置します。実際には、読者が私の間違いを無視して、ドキュメントに自然に表示されるように配置するのは非常に間違っていると思います。

その他の組み合わせ：

ガイドタグが価格であることを考慮して、ドキュメント内で自然に配置される位置にその位置を設定し、前述のように、写真の下に配置します。次に、相対位置を使用して残りのすべてを正しく配置できます。そうです、これは簡単で期待どおりですが、親の価格である価格が正しく配置されていません。

これはそうだろう

li.listado_town{position:relative; bottom:160px; left:130px;}
li.listado_region{position:relative;bottom:150px; left:130px;}
li.listado_m2{position:relative;bottom:140px; left:130px;}
4

2 に答える 2

0
于 2012-11-11T10:11:43.427 に答える
0

写真の周りに幅を持たせたほうがいいかもしれません。次に、単語に別の単語を追加する必要があります。

何かのようなもの：

<div>
     <div width="10px" style="float: left; margin-right:10px;">picture</div>
     <div width="10px" style="float: left;">
          <p>word</p>
          <p>word1</p>
          <p>.....</p>
          <p>word20</p>
     </div>
</div>

コードをここに貼り付け(古いコードを最初に削除)、結果を確認します。

于 2012-11-11T10:12:41.407 に答える