HTMLタグ：imgタグの使い方まとめ

この記事の内容は HTML タグに関するものです。img タグの使用法をまとめています。必要な方は参考にしていただければ幸いです。

1. Img タグには 2 つの重要な属性があります:

1.src 属性: 画像のアドレス

2.alt 属性: 画像には実際のテキストは表示されません

2. Img タグは行レベルの要素 :

img と input はインライン置換要素です。高さ/幅/パディング/マージンはすべて利用可能です。効果はブロック要素と同等です。インライン非置換要素、たとえば、高さ/幅/パディング上、下/マージン上/下は、幅の変更に使用できるのはパディング左/右とマージン左/右のみです。

3. Img タグを中央に配置します:

1. 最初の方法: この方法はあまり好きではありません。Img タグを table-cell に設定することはできません。エラーが発生しやすい。

img_p{
        display: table-cell;vertical-align: middle;  /*控制图片垂直居中*/
        text-align: center;  /*控制图片水平居中*/      }

2. 2 番目の方法: この方法では、Img タグに margin 属性を持たないことが最善です。そうしないと中央に配置されません。

img{
    position: absolute;top:50%;left: 50%;
    transform:translate(-50%,-50%);    
}

4. Imgタグイベント:

1. HTML DOM Eventオブジェクトのonerrorイベントを使用して、例外を表示する画像を処理します。

<img src="img/1.jpg" alt="这是一张图片" onerror="alert(this.alt)">

おすすめ関連記事:

htmlレイアウト: HTML 3カラムレイアウトの実装コード

innerHTML 属性とは何ですか? innerHTML 属性の使用法

以上がHTMLタグ：imgタグの使い方まとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。