要素テーブルからヘッダーを削除する方法

要素テーブルからヘッダーを削除する方法

show-header
属性を使用したドキュメントのヒントshow-header

 <el-テーブル
            :data="テーブルデータ1"
            :span-method="配列スパンメソッド"
            国境
            :show-header="ステータス"
              <el-テーブル列
              prop="ラベル"
              ラベル=""
              幅="180">
            </el-table-column>
           /el-テーブル >

!!!重點就是要:show-header動態控制

Element-uiテーブルはすべての境界線を削除します

el-table に class="customer-no-border-table" を追加します

/*表のセルの境界線を削除します*/
   .customer-no-border-table th{
     境界線:なし;
   }
.customer-no-border-table td、.customer-no-border-table th.is-leaf {
  境界線:なし;
}
 /*テーブルの最も外側の境界線*/
.customer-no-border-table .el-table--border、.el-table--group{
     境界線: なし;
   }
  /*ヘッダーの境界線*/
   .customer-no-border-table thead tr th.is-leaf{
     境界線: 0px 実線 #EBEEF5;
     右境界線: なし;
   }
.customer-no-border-table thead tr th:nth-last-of-type(2){
  右境界線: 0px 実線 #EBEEF5;
}
 /*表の最も外側の境界線 - 下の境界線*/
.customer-no-border-table .el-table--border::after、.customer-no-border-table .el-table--group::after{
     幅: 0;
   }
.customer-no-border-table::before{
  幅: 0;
}
.customer-no-border-table .el-table__fixed-right::before,.el-table__fixed::before{
  幅: 0;
}
.customer-no-border-table .el-table__header tr th{
  背景: #fff;
  色: #333333 ;
  パディング: 3px;
  フォントの太さ: 550 ;
  高さ: 36px;
  境界線: 0px;
  フォントサイズ: 15px;
}

要素テーブルのヘッダーを削除する方法についての記事はこれで終わりです。要素テーブルのヘッダーを削除する方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • 要素テーブルヘッダー行の高さの問題の解決
  • Vue+Element カスタム垂直テーブルヘッダーチュートリアル
  • 要素はテーブルのネストを実現し、複数のテーブルが1つのヘッダーを共有します。
  • Vueは要素テーブルにヘッダー情報プロンプト機能を実装します(推奨)
  • Vue+elementuiは、複雑なヘッダーと動的に追加された列の2次元テーブル機能を実現します。
  • VUE2.0+ElementUI2.0 テーブル el-table はヘッダー拡張 el-tooltip を実装します

<<:  ROS で Turtlebot3 移動ロボットを制御するための基本的なチュートリアル

>>:  HTMLにリンクを挿入する方法

推薦する

CSSカスタムプロパティの予備的な理解

現在、CSS プリプロセッサは Web 開発の標準となっています。 プリプロセッサの主な利点の 1 ...

MYSQL スロークエリとログの例の説明

1. はじめにスロークエリログを有効にすると、MySQL は指定された時間を超えるクエリステートメン...

Linux/Docker で System.Drawing.Common を使用する

序文プロジェクトを .net core に移行した後、 System.Drawing.Commonコ...

HTML DOM入門_PowerNode Javaアカデミー

DOMとは何ですか? JavaScript を使用すると、HTML ドキュメント全体を再構築できます...

WeChatアプレット開発の章:落とし穴の記録

最近、会社初のミニプログラムの開発に参加しました。開発経験は基本的にWebViewをベースとしたハイ...

要素 UI に基づいてクエリ コンポーネントを段階的にカプセル化する方法

目次関数基本的なクエリ関数クエリ条件の初期化ページのレンダリングクエリと表示の最適化をさらに強化プル...

JavaScriptのクローン作成についての簡単な説明

目次1. 浅いクローニング2. ディープクローニング1. 浅いクローニング浅いクローンでは配列やオブ...

実用的な基本的な Linux sed コマンドのサンプルコード

Linux ストリーム エディターは、データ センターでスクリプトを実行するのに便利な方法です。これ...

Vue の共通 A​​PI と高度な API の概要

目次次のチェックミックスイン$強制更新設定、削除フィルター指令その他の単純な共通プロパティとメソッド...

HTML メタタグの一般的な使用例のコレクション

マタタグとは<meta> 要素は、検索エンジン向けの説明やキーワード、更新頻度など、ペー...

ブラウザでTIF形式の画像を表示する方法

ブラウザはTIF形式の画像を表示しますコードをコピーコードは次のとおりです。 <html>...

MYSQL における char と varchar の違い

CHAR 型と VARCHAR 型は似ていますが、主に格納場所、末尾のスペース、取得方法が異なります...

Docker 構成コンテナの場所とヒントのまとめ

Docker の使用に関するヒント1. 停止したDockerコンテナをすべてクリーンアップする停止し...

MySQL テーブルの読み取り、書き込み、インデックス作成、その他の操作の SQL ステートメントの効率最適化の問題を分析します。

前回は、Explain 実行プランの表示、インデックスの分析など、MySQL での SQL クエリの...

Linux での MySQL 5.6.33 のインストールと設定のチュートリアル

このチュートリアルでは、LinuxでのMySQL 5.6.33のインストールと設定方法を参考までに紹...