8

私の基本的なレイアウトはこれです： 

<table>
...
</table>
<table>
...
</table> // There's actually five tables, but that's irrelevant
<img .../>
</body>

画像をすべてのテーブルの下のフッターにしようとしていますが、管理できる最善の方法は、画像がテーブルの右側に固定されることです（画面が大きいため、テーブルの下に折り返される可能性があります） 、ただし私にとってはそうではありません）または、position：absoluteを使用して、テーブルの真上にフロートさせることができます。私の人生では、画像をテーブルの下に強制的にラップすることはできません。

画像をdivでラップして、属性/プロパティのあらゆる種類の組み合わせをdivに追加しようとしましたが、前述のように、これらはすべて、上記の2つの悪い結果のいずれかを生成します。

誰かが何らかの解決策を提供できますか？

divを他の隣ではなく下に表示させる方法のような他のSOの質問を見たことがありますか？、しかし私はその解決策をまったく理解していません（どのようにfloat：leftは何かを他のものの下に強制しますか？）そして私はまた解決策が追加のラッパーを必要とすることを確信していません<div>。

4

4 に答える 4

11 
<div>
<table>
...
</table>
<table>
...
</table>

</div>
<div style="clear:both;">
<img .../>
</div>

</body>

またはcssを使用します。imgまたはdivタグのスタイルを作成します。

于 2012-08-01T17:53:51.633 に答える
9

テーブルを含む最後のdivの直後に、次を追加します。

<div style="clear:both"></div>

そしてそれは機能します:)あなたのdivは使用してfloat: leftいるので、このすべてのフローティングを停止するように指示するdivを配置する必要があります！

于 2012-08-01T17:53:27.207 に答える
4

次のスタイルを画像に適用します。

<img style="display:block;clear:both;" .../>
于 2012-08-01T17:53:35.303 に答える
2

あなたはcssでそれを行うことができます。画像にクラスを追加してから、ブロックまたはフロートをクリアするように変更します。例えば、

HTML：

<img src="" class="my-img" />

CSS：

.my-img
{
display:block;
/*Or*/
clear:both;
}
于 2012-08-01T17:52:39.110 に答える