タグ付けされた質問 「html-table」

HTMLに関連するため、テーブルはデータを表形式で表示するために使用されます。HTMLテーブルに関する質問は、問題のあるソースコードを示すことによって行う必要があります。または、質問が欲望に従ってテーブルを作成する試みの失敗に関するものである場合、質問者は失敗した試みを示し、期待を説明し、どのように行動が異なっていた。

7
CSSテーブルセルの等しい幅
テーブルコンテナー内のテーブルセル要素の数が不確定です。 <div style="display:table;"> <div style="display:table-cell;"></div> <div style="display:table-cell;"></div> </div> 異なるサイズのコンテンツが含まれている場合でも、テーブルセルの幅を等しくする純粋なCSS方法はありますか? ありがとう。 編集:最大幅を持っていると、私が思うにいくつのセルを持っているかを知る必要がありますか?
147 html  css  html-table 

9
HTMLテーブルの列を非表示/表示
複数の列を持つHTMLテーブルがあり、jqueryを使用して列チューザーを実装する必要があります。ユーザーがチェックボックスをクリックすると、テーブルの対応する列を表示/非表示にします。テーブルのすべてのtdにクラスをアタッチせずにこれを実行したいのですが、jqueryを使用して列全体を選択する方法はありますか?以下はHTMLの例です。 <table> <thead> <tr><th class="col1">Header 1</th><th class="col2">Header 2</th><th class="col3">Header 3</th></tr> </thead> <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr> <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr> <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr> <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr> </table> <form> <input type="checkbox" name="col1" checked="checked" /> Hide/Show Column 1 <br /> <input type="checkbox" name="col2" checked="checked" /> Hide/Show Column 2 <br /> <input type="checkbox" name="col3" checked="checked" /> Hide/Show Column 3 <br /> </form>
146 jquery  html  hide  html-table  show 

9
表のセル<td>の内容を強制的に折り返す方法は?
ページ全体*折り返し可能はmain.cssファイルで定義されています /* Wrappable cell * Add this class to make sure the text in a cell will wrap. * By default, data_table tds do not wrap. */ td.wrappable, table.data_table td.wrappable { white-space: normal; } ページ全体がここにあります: &lt;%@ include file="../../include/pre-header.html" %&gt; &lt;form id="commentForm" name="commentForm" action="" method="post"&gt; &lt;ctl:vertScroll height="300" headerStyleClass="data_table_scroll" bodyStyleClass="data_table_scroll" enabled="${user.scrollTables}"&gt; &lt;ctl:sortableTblHdrSetup …
146 html  css  html-table 

25
ユーザーがjQueryでビューの外にスクロールしたときに上部に固定されたテーブルヘッダー
ユーザーがビューの外にスクロールしたときにのみ、ヘッダーがページの上部にとどまるHTMLテーブルを設計しようとしています。たとえば、テーブルがページから500ピクセル下にある可能性があります。ユーザーがヘッダーを非表示にスクロールした場合(ブラウザーがウィンドウビューでヘッダーを検出しなくなった場合)、上部に表示されるようにするには、どうすればよいですか。 ?誰でも私にこれに対するJavascriptソリューションを与えることができますか? &lt;table&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;Col1&lt;/th&gt; &lt;th&gt;Col2&lt;/th&gt; &lt;th&gt;Col3&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;td&gt;info&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; したがって、上記の例で&lt;thead&gt;は、ページが表示されなくなった場合にでスクロールします。 重要:にスクロールバー(overflow:auto)があるソリューションを探していません&lt;tbody&gt;。
145 jquery  html  html-table 

9
TD内のDIVは悪い考えですか?
私はどこかで&lt;div&gt;内部がノーノーであると聞いた/読んだよう&lt;td&gt;です。それが機能しないわけではなく、ディスプレイのタイプに基づいて実際に互換性がないということだけです。私の直感を裏付ける証拠が見つからないので、私は完全に間違っているかもしれません。


6
HTMLテーブルからボーダーを完全に削除する方法
私の目標は、「フォトフレーム」に似たHTMLページを作成することです。つまり、4枚の写真で囲まれた白紙のページを作りたいです。 これは私のコードです: &lt;table&gt; &lt;tr&gt; &lt;td class="bTop" colspan="3"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td class="bLeft"&gt; &lt;/td&gt; &lt;td class="middle"&gt; &lt;/td&gt; &lt;td class="bRight"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td class="bBottom" colspan="3"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; また、CSSクラスは次のとおりです。 .bTop { width: 960px; height: 111px; background-image: url('../Images/BackTop.jpg'); } .bLeft { width: 212px; height: 280px; background-image: url('../Images/BackLeft.jpg'); } .middle { width: 536px; …


14
<td>タグでテキストを折り返す
&lt;td&gt;要素に追加されたテキストをラップしたい。で試しましたstyle="word-wrap: break-word;" width="15%"。しかし、それはテキストを折り返していません。100%の幅を与えることは必須ですか?表示する他のコントロールがあるため、15%の幅しか使用できません。

6
100%幅のテーブルでdivコンテナーがオーバーフローしています
親コンテナーでオーバーフローしているhtmlテーブルに問題があります。 .page { width: 280px; border:solid 1px blue; } .my-table { word-wrap: break-word; } .my-table td { border:solid 1px #333; } &lt;div class="page"&gt; &lt;table class="my-table"&gt; &lt;tr&gt; &lt;th&gt;Header Text&lt;/th&gt; &lt;th&gt;Col 1&lt;/th&gt; &lt;th&gt;Col 2&lt;/th&gt; &lt;th&gt;Col 3&lt;/th&gt; &lt;th&gt;Col 4&lt;/th&gt; &lt;th&gt;Header Text&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;An archipelago is a chain or cluster of islands. The …
136 html  css  html-table 

9
JavaScriptでHTMLテーブル本体に行を挿入する方法
ヘッダーとフッターのあるHTMLテーブルがあります。 &lt;table id="myTable"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;My Header&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;aaaaa&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;My footer&lt;/td&gt; &lt;/tr&gt; &lt;tfoot&gt; &lt;/table&gt; tbody次の行を追加しようとしています: myTable.insertRow(myTable.rows.length - 1); 行がtfootセクションに追加されます。 どうやって挿入しtbodyますか?



14
Internet Explorer 9がテーブルセルを正しくレンダリングしない
私のウェブサイトは常にIE8、IE7、FF、Chrome、Safariでスムーズに動作しています。現在、IE9でテストしていますが、奇妙な問題が発生しています。一部のページでは、一部の表形式データが正しく表示されません。 HTMLソースはすべて正しく、ページを更新するたびに問題を示す行が変更されます(実を言うと、問題自体はすべてではなく、一部の更新でのみ表示されます)。 IEのF12ツールを使用すると、テーブル構造が正しく表示されます。M08000007448を含むTDの後に空のTDがあってはなりませんが、このように表示されます。 さらに、F12ツールを使用し、ツールバーの「要素をクリックして選択」ツールで、M08000007448と19の間の空のスペースをクリックしようとすると、「hidden td」ではなくTRが選択されます。 このテーブルレンダリングの問題は、アプリケーションの他のいくつかのテーブルでも発生しています。誰かがこのようなことを経験していますか?IE9でのみ発生します:( それが重要かどうかはわかりませんが、ページはASPNET(ウェブフォーム)で作成され、Jqueryと他のJSプラグインを使用しています。 ページを(画像付きで)保存し、IE9を使用してローカルで開いてみましたが、問題は発生しません。(もちろん、私はすべてのテーブル構造をチェックしましたが、問題ありません。ヘッダーとすべての行は、実際には同じ数のTDを持ち、必要に応じて正しい数のcolspanを持っています)。

9
jqueryは、特定のインデックスでテーブルに新しい行を挿入します
jqueryを使用してテーブルに新しい行を追加または追加する方法を知っています。 $('#my_table &gt; tbody:last').append(html); どのように私は特定の「行インデックス」へ(HTML変数で与えられた)行を挿入しますi。したがってi=3、たとえば、行がテーブルの4番目の行として挿入されます。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.