div 内の img と span の垂直方向の中央揃えの問題について

div 内の img と span の垂直方向の中央揃えの問題について

以下のように表示されます。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>   
  2. <ヘッド>   
  3. <スタイル>   
  4. #テスト *{vertical-align:middle;}
  5. </スタイル>   
  6. <本文>   
  7. < div   
  8. id = "テスト" >   
  9. <画像  
  10. src = "http://127.0.0.1:7001/wsc/images/message.png" />   
  11. < span > sdfhsdhfdksfjhtes: </ span >   
  12. </div>   
  13. </本文>   
  14. </html>   

ご注意ください: #test *{vertical-align:middle;}s

#test * は、span、input、img などのインライン要素を含む div 内のすべての要素を表します。

垂直方向の配置
初期値: ベースライン (デフォルト値)
継承可能: いいえ 適用対象: インライン要素 説明: vertical-align:baseline は、要素のベースラインを親要素のベースラインに揃えます。
警告: vertical-align は、表のセル内のコンテンツの配置には影響しません。また、ブロック要素内のコンテンツの配置にも影響しません。

注意: vertical-align は、span、img、em、input、a などのインライン要素にのみ影響し、div、h3、p などのブロック要素には無効です。

以上が、エディターが提供した、div 内の img と span の垂直中央揃えの問題についての内容です。お役に立てれば幸いです。123WORDPRESS.COM を応援してください。

<<:  ウェブサイトをIE6、7、8、9の古いバージョンに対応させるための3つのソリューション

>>:  JavaScript の非同期処理で待機時間を節約できますか?

推薦する

Windows 7 での MySQL 8.0.18 の導入とインストールのチュートリアル

1. 事前準備 (windows7+mysql-8.0.18-winx64) 1. ダウンロードアド...

Win7 システムでの MySQL 5.7.11 の詳細なインストール チュートリアル

オペレーティング システム: Win7 64 ビット Ultimate Edition MySQL ...

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

MySQL 8.0.25の最新のダウンロードとインストールのチュートリアルは参考になります。具体的な...

複数のドメイン名、ポート、IP仮想ホストに基づくNginx構成

1. タイプの導入1.1 ドメインベースの仮想ホスティングいわゆるドメイン名ベースの仮想ホストとは、...

Power Shell に vim 実装コード例を追加する方法

1. Vimの公式ウェブサイトにアクセスして、オペレーティングシステムに適した実行ファイルをダウンロ...

Vue双方向バインディングの詳細な説明

目次1. 双方向バインディング2. 他のタグを選択した場合にも同じ結果になりますか? 答えはもちろん...

Zabbix と bat スクリプトを組み合わせて複数のアプリケーションの状態を監視する方法

シナリオシミュレーション:国内企業の中には、重要な業務をサポートするために特定のウィンドウ プログラ...

Vue を使用して 2 つのデータ セットの違いを比較する視覚化コンポーネントの詳細な説明

目次必要:要点:これまでの要点に従って、コンポーネントのプロパティを確立できます。コンポーネントの基...

MySQL でシンプルな検索エンジンを実装するためのサンプルコード

目次序文導入ngram全文パーサー全文インデックスを作成する検索方法1. 自然言語検索(自然言語モー...

入力のsize属性とmaxlength属性の違い

最近、プロジェクトで input size 属性と maxlength 属性を使用しました。以前は、...

Dockerでspringcloudプロジェクトをデプロイする方法

目次Dockerイメージのダウンロードmysqlとnacosを起動する独自のJavaプロジェクトを変...

Linux カーネル デバイス ドライバー カーネル リンク リストの使用上の注意

/******************** * カーネルにおけるリンクリストの応用********...

HTMLでカスタムタグを使用する方法

カスタム タグは XML ファイルと HTML ファイルで自由に使用できますが、いくつか注意すべき点...

デプロイから基本操作までDocker Swarm

Docker SwarmについてDocker Swarm は次の 2 つの部分で構成されます。 D...

MySQLのSeconds_Behind_Masterの詳細な説明

目次マスターの後ろの秒数オリジナルの実装最終マスタータイムスタンプマスターとのクロック差他の実行時間...