テーブルの一部を固定

Wordpressで一部「CSS」の表示が「HTML サイト」と異なるための表示テスト

下記のテーブルの記述は、「Wordpress + Lightning」のサイトとほぼ同じCSS。
しかし、こちらのHTML サイトでは、「border: 1px solid #ccc;」で、何も問題ないことがわかると思います。

「Wordpress + Lightning」のサイトはこちら↓
CSS テーブル(表)の見出し部分(一部)を固定してスクロール 4パターン


■【1】 行(横軸)を固定してスクロールする
   【table class="yoko"】

見出し 見出し 見出し
テキスト テキスト テキスト
テキスト テキスト テキスト
テキスト テキスト テキスト
テキスト テキスト テキスト
テキスト テキスト テキスト
テキスト テキスト テキスト





■【2】 列(縦軸)を固定してスクロールする【table class="tate"】

見出し テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト





■【3】 行(横軸)と列(縦軸)どちらも固定する
   【table class="yoko-tate"】

見出し 見出し 見出し 見出し 見出し 見出し 見出し 見出し
見出し テキスト テキスト テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト テキスト テキスト
見出し テキスト テキスト テキスト テキスト テキスト テキスト テキスト

【3】テーブルの「行(横軸)」と「列(縦軸)」どちらも固定してスクロールするに戻る

CSS テーブル(表)の見出し部分(一部)を固定してスクロールする方法ページトップに戻る





■【4】テーブルの「列(縦軸)」を途中で固定する
   【table class="tatetocyu"】

見出し テキスト 固定 テキスト テキスト テキスト テキスト テキスト
見出し テキスト 固定 テキスト テキスト テキスト テキスト テキスト
見出し テキスト 固定 テキスト テキスト テキスト テキスト テキスト
見出し テキスト 固定 テキスト テキスト テキスト テキスト テキスト
見出し テキスト 固定 テキスト テキスト テキスト テキスト テキスト


CSS テーブル(表)の見出し部分(一部)を固定してスクロールする方法に戻る