2

現在、ウェブサイトの上部に、幅 100% のテーブル、1 行、複数のテーブル分割で構成されるテーブルがあります。nav 分割の数は、現在のページに依存し、動的に生成されるため、td 幅を簡単に設定する方法はありません。さらに、各ナビゲーション項目のテキストを中央に配置して、各ナビゲーション項目の一種の箇条書きとして矢印の小さな画像を使用しようとしていますが、配置できない場合はこれを削除することになります.

私の最終的な目標は、ナビゲーション バーに 6 ～ 10 個のアイテムを配置し、テキストに合わせてサイズを変えながら、それらの td セルをバー内に均等に配置することです。矢印とテキストの両方を一緒に使用しようとすると問題が発生します。これは、テキストがテキストと一致するのではなく、次の行に自動的にワードラップされるためです。これにより、テーブルが変な形になります。さらに、私が試したいくつかのケースでは、最初のセルは設定したパディングのサイズが正しい場合があります (たとえば、7px のままですが、表の行の終わりまでに、50px 近くのように間隔が完全に間違っています)。

これを機能させるための div、td、および CSS の組み合わせのようなものはありますか? 代わりにdivから作成したほうがよいでしょうか？ナビゲーション形式を維持しながら、これらのセルを均等に配置する方法のアイデアが不足しています。どんな助けでも大歓迎です。

ここに私が現在いるもののスクリーン キャプチャがあります: http://dl.dropbox.com/u/27295687/Untitled.png

4

2 に答える 2

0

これはあなたがやろうとしていることですか？

table-layout: fixed;重要なCSS属性はテーブル要素にあると思います

于 2012-08-02T21:28:09.210 に答える
0

このバーを作成したコードを見せてください。これを HTML で作成する方法は 100 通りあります。

これは、矢印の画像が<div>. div-s は、 を持つことで自動的に行全体を占めますwidth: 100%。画像に幅があることを確認し、div でラップされている場合は、次のスタイルを使用します。

<div style="display: inline-block;"><img src="arrow.gif"></div>

ただし、コードを見れば、直接的な回答が得られる可能性があります。

于 2012-08-02T21:54:16.530 に答える