CSS の無効な行の高さ設定の問題の解決策
|
CSS の無効な行の高さ設定について まず、次のコード文字列を記述します。
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<title>ドキュメント</title>
<スタイル タイプ="text/css">
。頭{
高さ: 100px;
テキスト配置: 中央;
line-height: 100px;/* フォントを中央に配置するために行の高さを設定します*/
background: #333;/* フォントが見やすくなるように背景全体を黒に設定します*/
色: 赤;
font:700 18px simsun;/* フォントを設定する*/
}
</スタイル>
</head>
<本文>
<div class="head">
こんにちは、西南石油大学です。
</div>
</本文>
</html>次に、ブラウザで開いて効果を確認します。
垂直方向では、ボックスの中央にフォントが表示されないことがわかりました。 次に、フォントを設定するステートメントの下に、行の高さを設定するステートメントを配置します。
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<title>ドキュメント</title>
<スタイル タイプ="text/css">
。頭{
高さ: 100px;
テキスト配置: 中央;
background: #333;/* フォントが見やすくなるように背景全体を黒に設定します*/
色: 赤;
font:700 18px simsun;/* フォントを設定する*/
line-height: 100px;/* 行の高さを設定する*/
}
</スタイル>
</head>
<本文>
<div class="head">
こんにちは、西南石油大学です。
</div>
</本文>
</html>次にブラウザで開きます:
フォントが真ん中にジャンプしました~~~~~ 要約: CSS で行の高さを設定する場合、line-height 属性はフォントより下にする必要があります。そうでない場合は無効になります。 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 |
>>: Linux での Docker のインストールと展開の例
推薦する
Workermanはmysql接続プールのサンプルコードを書きます
まず、接続プールを使用する理由と、接続プールによってどのような問題が解決できるかを理解する必要があり...
MYSQL メタデータ ロック (MDL ロック) の理論とロック タイプ テスト
目次MYSQL メタデータ ロック (MDL ロック) 学習理論とロック タイプ テスト1. 予備的...
rem をモバイル デバイスに適応させる方法の例
序文モバイル端末のREM適応ソリューションのレビューと概要remの使い方rem 単位の計算は、HTM...
表 td 画像水平および垂直中央揃えコード
HTMLコード:コードをコピーコードは次のとおりです。 <td align="cen...
MySQLクエリ速度が遅く、パフォーマンスが低下する原因と解決策
1. データベースクエリの速度に影響を与えるものは何ですか? 1.1 データベースクエリ速度に影響を...
Windows に MySQL をインストールする方法のグラフィック チュートリアル
概要: この記事では主に、Windows 環境に MySQL をインストールする方法について説明しま...
横スクロールウェブサイトデザインの概要
水平スクロールはあらゆる状況に適しているわけではありませんが、適切に行えば、Web サイトを他のサイ...
JSはショッピングカート効果の単純な加算と減算を実装します
この記事の例では、ショッピングカートの簡単な追加と削除を実現するためのJSの具体的なコードを参考まで...
MySql インデックスはクエリ速度を向上させる一般的な方法のコード例
インデックスを使用してクエリを高速化する1. はじめにWeb 開発には、ビジネス テンプレート、ビジ...
CSS における zoom:1 属性の定義と機能
今日、CSS の zoom 属性は何のために使用されるのかと尋ねられました。この属性は、フローティン...
MySQL統計テーブルのサイズを説明する例
各データベース内の各テーブルのサイズをカウントすることは、データ ガバナンスの最も単純な要件の 1 ...
Linux の Centos7 に Mysql5.7.19 をインストールする詳細なチュートリアル
1. MySQLをダウンロードするURL: https://dev.mysql.com/downlo...
HTML でランダムロールコーラーを実装するためのサンプルコード
この点呼装置は簡易版であり、自動停止の必要性を考慮していないため、点呼を開始した後、停止ボタンをクリ...
CSS のインライン スタイルに変換するソリューション (css-inline)
シーンについて話すメールを送信サードパーティのウェブサイトにHTMLを埋め込む他の編集者の記事をコピ...
PHP-HTMLhtml 重要な知識ポイントメモ（必読）
1. フレームセット、フレーム、iframeを使用して複数のウィンドウを実現する2. 画像上のマッ...