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接続とマルチテーブルクエリの詳細な説明

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

推薦する

MySQL データ型における DECIMAL の使用法の詳細な説明

MySQL データ型における DECIMAL の使用法の詳細な説明MySQL のデータ型には、INT...

Ubuntu ターミナル マルチウィンドウ 分割画面 ターミネーター

1. インストールターミネーターの最大の特徴は、1つのウィンドウで複数のターミナルを開くことができる...

MySQL の組み込み関数 find_in_set を使用した効率的なあいまい検索の詳細な説明

一般的に使用される方法は次の 4 つです。 1.locate()メソッドを使用する一般的な使用法: ...

js でオブジェクトとオブジェクト メソッドを作成するいくつかの方法の詳細な説明

この記事は、JS レッドブックの第 8 章に記載されているオブジェクトに関する 2 番目の記事です。...

Zabbix ベースの Jenkins プロセス監視の詳細な説明

1. 監視アーキテクチャ図 2. 実装のアイデアJenkins に Metrics プラグインをイン...

JavaScript で Webpack を使用するチュートリアル

目次0. Webpackとは1. Webpackの使用2. Webpackのコアコンセプト2.1 エ...

Vue3の状態管理の使用方法の詳細な説明

目次背景提供/注入共有状態の抽出データを提供するデータの挿入まとめ反応的な共有状態の抽出共有状態の使...

CSV、Excel、SQL ファイルを MySQL にインポートするためのヒント

1. csvファイルをインポートする次のコマンドを使用します。 1.mysql> infile...

文字列の最初の文字を取得してテキストアイコン機能を実現する純粋なCSS

CSS でテキストアイコンを実装する方法 /*アイコンスタイル*/ .nav-icon-norma...

ARGB、RGB、RGBAの違いと紹介

ARGB は、アルファ (透明度) チャネルが追加された RGB カラー モードであり、32 ビット...

MySQL シリーズ 11 ログ

チュートリアルシリーズMySQL シリーズ: MySQL リレーショナル データベースの基本概念My...

Vue の 4 つのカスタム命令の説明と使用例

4つの実用的なVueカスタム指示1. Vドラッグ要件: マウスドラッグ要素アイデア:要素のオフセット...

ウェブページのアクセス速度に関する主な問題と解決策

<br />ウェブサイトのアクセス速度はウェブサイトのトラフィックに直接影響を及ぼし、ウ...

MySQL 派生テーブル(Derived Table)の簡単な使用例分析

この記事では、例を使用して、MySQL 派生テーブルの簡単な使用方法を説明します。ご参考までに、詳細...

フォーム入力ボックスに関するWebデザインのヒント

1. キャンセル ボタンが押されたときの破線ボックス<br /> 入力に属性値 hide...