HTMLのテーブルの内容は中央に水平と垂直に表示されます

HTMLのテーブルの内容は中央に水平と垂直に表示されます

CSSスタイルファイルで指定

#class td /*表のテキストを左右上下に揃えるように設定する*/ 
{  
    垂直位置合わせ: 中央;
    テキスト配置: 中央;  
}
/*class はそれが属するクラスです*/
<div id="class" align="center" style="margin: 0cm 0cm 0pt; text-align: left">                                                                      
<table class="table table-bordered" border="1" width="100%" style="font-size: 14pt; color: #000000; font-family: 楷体;mso-ascii-font-family: 'times new roman'; mso-hansi-font-family: 'times new roman'">                                                             
<caption><h2 style="text-align: left;font-size: 16pt;font-family: 宋体;color: red;">タイトル</h2><
/キャプション>                                                              
<t本文>                                                                 
<tr style="font-weight: bold;mso-bidi-font-size: 12.0pt;font-family: 宋体;" >                                                                      
<td>シリアル番号</td>                                                                      
<td>適用可能な状況</td>                                                                      
 <td>詳細</​​td>                                                                       
<td>備考</td>                                                                   
 </tr>                                                                                                                                       
<tr>                                                                    
<td>1</td>                                                                     
<td>xxxxx</td>                                                                      
<td style="text-align: left;"> <!--左揃えを指定します-->                                                                     
 <span>                                                                             
xxxxxx<br>                                                                                                                                                        
</span>                                                                      
</td>                                                                       
<td><a href="#">詳細を表示</a>
</td>                                                              
</tr>                                                
</tbody>                                                          
</テーブル> 
</div>

上記ではdivのクラスとしてidを指定し、図に示すように、tableの属性tdはcssで指定されたスタイルを使用します。

這里寫圖片描述

以上が、HTML でのテーブル コンテンツの水平および垂直中央揃えについてご紹介した内容です。お役に立てれば幸いです。ご質問がある場合は、メッセージを残していただければ、すぐに返信いたします。また、123WORDPRESS.COM ウェブサイトをサポートしてくださっている皆様にも感謝申し上げます。

<<:  Vueでaxiosをカプセル化する方法

>>:  MySQLの連結関数CONCATの使い方の詳しい説明

推薦する

UbuntuはCUDAの複数のバージョンをインストールし、いつでも切り替えることができます

CUDA とは何かを紹介するのではなく、複数の CUDA バージョンの共存とリアルタイム切り替えをど...

DD DT DLタグの使用例

通常は <ul><li> タグを使用しますが、dd タグと dt タグも便利...

MySQL クエリ キャッシュのグラフィカルな説明

目次1. 原則の概要クエリキャッシュシステム変数1. クエリキャッシュを持つ2. クエリキャッシュ制...

nginx 用の zabbix 5.0 をインストールして展開する方法

目次実験環境インストールと展開データベースをインストールして設定します (ここでは mariadb ...

JSフロントエンドモジュール化のいくつかの仕様についての簡単な説明

目次序文フロントエンドモジュール開発の価値厄介な名前の競合面倒なファイル依存関係モジュール化の利点C...

WeChatミニプログラムをTencent Mapsに接続する2つの方法

最近、WeChat アプレットを作成しているのですが、いくつか問題が発生しました。インターネットでい...

Linux 負荷分散 LVS の詳細な理解

目次1. LVS 負荷分散2. 負荷分散LVSの基本紹介3. LVSアーキテクチャ3.1 ロードバラ...

HTML の POST リクエストにおける a タグの 2 つの使用法の分析

HTML POST リクエストで a タグを使用する 2 つの例を次に示します。 1. ajaxを使...

Nexus をベースに Alibaba Cloud プロキシ ウェアハウスを構成するプロセスの分析

Nexus のデフォルトのリモートリポジトリは https://repo1.maven.org/ma...

Vueプロジェクトでのトークン検証ログイン(フロントエンド部分)

この記事の例では、Vueプロジェクトでのトークン検証ログインの具体的なコードを参考までに共有していま...

Windows 上で Zookeeper サーバーを構築するチュートリアル

インストールと設定Apacheの公式ウェブサイトには多くのミラーダウンロードアドレスが用意されており...

Vue で Baidu Map を呼び出して経度と緯度を取得する

プロジェクトでは、現在地の緯度経度を取得したり、場所を検索して緯度経度情報を取得したりする必要があり...

古典的なJavaScriptの再帰ケースの質問の詳細な分析

目次再帰とは何ですか?また、どのように機能しますか? 1. 合計(1)デジタル加算(2)配列の和2....

MySQL に接続する際に Navicat for MySQL が 2005 エラーを報告する問題を解決する

前回の記事では、Navicat for Mysql 接続エラー 1251 (接続失敗) の問題を解決...

VScode設定のリモートデバッグLinuxプログラムの問題を解決する

VScode リモートデバッグ Linux プログラムの問題について見てみましょう。具体的な内容は以...