CSSを使用してHTMLテキストボックス内のテキストの垂直方向の中央を制御する

CSSを使用してHTMLテキストボックス内のテキストの垂直方向の中央を制御する
Text の height 属性が定義されている場合、Text に入力されたテキストは垂直方向に中央揃えされません。ただし、CSS を追加してこれを制御し、入力されたテキストを垂直方向に中央揃えにして、Web ページをより完璧にすることができます。

コードをコピー
コードは次のとおりです。

<html>
<ヘッド>
<スタイル タイプ="text/css">
#文章 {
高さ:20px;
垂直位置揃え:中央;
line-height:20px; /*line-height は height と同じである必要があります*/
}
</スタイル>
</head>
<本文>
<テーブル>
<入力タイプ="テキスト" id="テキスト">
</テーブル>
</本文>
</html>

verticla-align と line-height の 2 つの属性を追加すると、テキスト ボックス内のテキストはテキスト ボックス内で垂直方向に中央揃えされます。line-height は height と同じでなければならないことに注意してください。

<<:  4種類のMySQL接続とマルチテーブルクエリの詳細な説明

>>:  繰り返し送信、繰り返し更新、バックオフ防止に関する問題と解決策の分析

推薦する

ページにデータを表示するReactメソッド

目次親コンポーネントリストボックスリストコンポーネントボタンコンポーネント PageButton昨年...

JavaScriptプロトタイプチェーンを理解する

目次1. プロトタイプとプロトタイプチェーンの平等関係を理解する2: プロトタイプとプロトタイプ チ...

JavaScript でピンボール ゲームの Web バージョンを実装する

参考までに、JavaScriptのオブジェクトとメソッドを使用して実装されたWebピンボールゲームを...

fileReader 使用時の落とし穴と解決策

目次fileReader に関する落とし穴iOS における FileReader の落とし穴 (イメ...

js におけるイベントバブリングとイベントキャプチャの簡単な分析

目次01-イベントバブリング1.1- イベントバブリングの概要1.2-イベントバブリングの利用(イベ...

MySQL で重複レコードをクエリして削除する方法の完全なガイド

序文この記事では主に、MySQL で重複レコードをクエリして削除する方法を紹介します。参考と学習のた...

...

CUDA8.0とCUDA9.0はUbuntu16.04で共存します

序文Github にある以前のコードには、CUDA 8.0 環境が必要なものもあります。初心者の場合...

Reactでwindow.print()を使用した際にページが応答しなくなる問題の解決記録について

目次1. 問題の背景: 2. 問題の原因: 3. 問題解決:要約: 1. 問題の背景: window...

MySQL 5.7.30 のインストールとアップグレードの問題に関する詳細なチュートリアル

くさびコンピュータにインストールされている MySQL のバージョンが比較的古く、おそらくバージョン...

HTMLを圧縮しない理由はいくつかある

理由は簡単です。 HTML ドキュメントでは、複数の空白文字は 1 つの空白文字と同等です。つまり、...

Ubuntu 20.04 Firefox でビデオを再生できない (Flash プラグインがない) 場合の解決策

1. Flashプラグインパッケージのダウンロードアドレス: https://get.adobe.c...

CSS scroll-snap スクロールイベント停止と要素位置検出の実装

1. スクロールスナップはフロントエンド開発者にとって必須のスキルですCSS スクロール スナップは...

Dockerfile の一般的なコマンドの概要

構文の構成: 1 注釈情報2 コマンド --- パラメータ [通常は大文字 | 実際には大文字と小文...