0

<table>基本的に行と列のあるテーブルなので、を使用して製品のリストを作成しようとしています。

アイテムのステータスが利用可能か利用不可かを列のリストの1つに表示したいのですが、利用可能な場合は小さな緑色のアイコンで、そうでない場合は赤色で表示したいと思います。また、そのアイコンをクリックして変更できるようにしたいと思います。

そこでグーグルで検索したところ、背景画像であれば配置できるかもしれませんが、クリック可能にしたいので、それは良くありません。

読んだすべての垂直方向の配置や中央などを試し、余白やパディングなどを試しましたが、小さなアイコン画像を小さなものの中央（水平方向と垂直方向）に配置できません<td>。

何かを片付けるには：

内で画像を配置する方法を知りたいだけです<td>。画像自体がアンカーであり、クリックするとページがリロードされ、アイコンが変化します。この画像を中に配置しようとしました<td>が、できません。それが私の質問です：それをどのように配置するのですか？

4

2 に答える 2

2

テーブルセル内で画像を整列させるのが難しい理由がわかりません。テーブルには、位置合わせに役立つ多くの便利なプロパティが含まれています。これは、テーブルセルの中央に画像が配置されたテーブルの例です。

http://jsfiddle.net/Puppies4Life/zka5Q/

于 2012-07-25T22:45:46.097 に答える
1

First of tableはデータにのみ使用する必要があり、製品のリストはデータではありません。プレーンな古いdivか、フロートされたLI要素がたくさんあるULのいずれかを使用することをお勧めします。

アイコンの場合は、「A」タグにして、アイコンを「A」タグの画像として配置するか、「A」タグの背景として配置するのがおそらく最善でしょう。

水平方向に揃えるには、親コンテナのtext-align：centerにします。

各商品が画像になり、設定された高さになると思いますか？もしそうなら、それを垂直に揃えるには、単にコンテナのパディングトップを正しい高さにして中央に設定します。

うまくいけば、上記があなたのために働くでしょう:)

于 2012-07-25T22:30:32.143 に答える