入力ボックスのカーソルサイズの表示が一貫していない問題の解決方法

入力ボックスのカーソルサイズの表示が一貫していない問題の解決方法
入力ボックス内のカーソルのサイズが一定ではありません

IE7とChromeの違いは非常に明白です

まず、問題の原因を見てみましょう。Chrome ブラウザは、カーソルの高さを次の原則で設定します。コンテンツがない場合、カーソルの高さ = 入力の行の高さの値。コンテンツがある場合、カーソルは入力の上部からテキストの下部に移動します。

さて、原因がわかったので、それに応じた対策を講じます。 2 つの方法を試しました:

方法 1: 行の高さの値をフォント サイズと同じに設定します。高さに達しない場合は、パディングを使用して高さをサポートします。

方法 2: Chrome の場合は line-height を設定しないでください。テキストが自動的に中央に配置されます。IE の場合は、テキストが垂直方向に中央に配置されることを確認するために line-height 値を設定してください。ここで注意すべき点は、リセット スタイル ファイルで line-height やその他の値が設定されている場合は、line-height をリセットしてください。line-height:normal を使用できます。詳細はテンセントハリウッドページの検索ボックスをご覧ください。

特定の CSS:

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

高さ: 34px;
フォントサイズ: 12px;
行の高さ: 通常;
行の高さ: 34px\9;

<<:  テキストレイアウトの問題を解決するためにテキストオーバーフローを使用する CSS3 の簡単な分析

>>:  最もよく使用されるJavaScriptイベントについて詳しく学ぶ

推薦する

MySQL 5.7.11 zip インストールと設定方法のグラフィックチュートリアル

1. MySQL 5.7.11 zipインストールパッケージをダウンロードするこのマシンはwin7 ...

理論の普及——ユーザーエクスペリエンス

1. 概念分析 1: UE ユーザー エクスペリエンス <br />英語ではユーザー エ...

Nginx+ModSecurity セキュリティモジュールの導入

目次1. ダウンロード2. 展開1.Nginxのデプロイメント2. ModSecurityの展開3....

WeChatアプレットコンポーネント開発:視覚的な映画座席選択機能

目次1. はじめに1. コンポーネントデータ2. コンポーネントページのレイアウト1. ロゴエリアの...

JavaScript 状態コンテナ Redux の詳細な説明

目次1. Reduxを選ぶ理由2. Reduxデータフロー3つの原則4. Reduxソースコード分析...

MySQL 5.7 と Mac 上の MySql の詳細なインストール図をダウンロードする

1.ブラウザに次のアドレスを入力します参考: 2. 次のインターフェースに入ります。下の場所をクリッ...

MySQL マスタースレーブレプリケーションの原理からインストールと設定までを包括的に解説します。

マスタースレーブレプリケーションがなぜ必要なのでしょうか? 1. 複雑な業務システムでは、SQL 文...

ネイティブ JS 音楽プレーヤー

この記事の例では、音楽プレーヤーを実装するためのJSの具体的なコードを参考までに共有しています。具体...

MySQL で複数の主キーが定義されているエラーの解決方法

主キーを作成するには 2 つの方法があります。 テーブルテーブル名を作成( フィールド名タイプ、 フ...

mysql のファイル mysql-bin.000001 とは何ですか? 削除できますか?

ポートを使用して MySQL をインストールした後、しばらくすると /var の容量が不足しているこ...

Vue の NetEase Cloud Music Player インターフェースを模倣したシンプルな実装プロセス

仕事のプロジェクトのニーズにより、曲の再生が必要となり、さまざまな資料を参考にして、NetEase ...

MySQL インデックス プッシュダウンの詳細

目次1. 左端接頭辞原則2. 表に戻る3. インデックスプッシュダウン序文:インデックス プッシュダ...

JavaScriptのアロー関数の特徴と通常の関数との違い

目次1. 矢印関数の使用1. 通常関数から矢印関数へ2. 中括弧を省略してリターンする3. 括弧を省...

MySQL をインストールした後に調整する必要がある 10 のパフォーマンス設定項目

このブログでは、MySQL データベースをインストールした後に調整することが推奨される 10 のパフ...

MySQL データベースの必須条件クエリ ステートメント

目次1. 基本的な文法2. 条件式によるフィルタリング3. 論理式によるフィルタリング4. あいまい...