写真といえば、誰もがよく知っていると思います。私たちは日常生活や使用の中で常に写真を目にすることができ、写真を適切に使用すると、言葉よりも表現力があり、魅力的なものになるからです。より美しく直感的です。特に Web ページの最初の表示は非常に重要です。
1.src属性
シンボル: 画像
特徴: シングルラベル
コード：
<!doctypehtml><html><head><metacharset=utf-8><title>HTML 挿入画像</title></head><body><p>表示される画像:</p><imgsrc=fish .jpg></body></html>
概要: 画像の挿入は、img タグに src 属性名を導入することで完了できます。src の属性値は「ファイル名」または「パス./ファイル名」です。 注: 挿入する画像は、 HTML プロジェクトと同じファイル Caught!このセクションでは重要な説明を提供します。
2. その他の属性
3. 代替の使用法
説明: 何らかの理由で画像が表示できない場合、alt属性に対応する属性値が表示されます。
コード：
<!doctypehtml><html><head><metacharset=utf-8><title>HTML 挿入画像</title></head><body><p>表示される画像:</p><imgsrc=potato .jpgwidth=500alt=ポテト></body></html>
以下に示します:
4. タイトルの使用
注: 画像が正常に表示されている場合、画像上にマウスを置くと、title 属性の属性値に対応する内容が表示されます。
コード：
<!doctypehtml><html><head><metacharset=utf-8><title>HTML 挿入画像</title></head><body><p>表示される画像:</p><imgsrc=fish .jpgwidth=500alt=fish title=これは調理された魚です></body></html>
効果: 画像が正常に表示される場合、画像上にマウスを置くと、「これは調理済みの魚です」という文字が表示されます。
次のように表示されます。
5. 属性の特性
イメージ タグの属性特性は、ほとんどの HTML タグに適用できます。
1. 開始タグ内にタグの属性を記述します。
2. タグ内に複数の属性が同時に存在できる
3. 属性はスペースで区切ります。
4. タグ名と属性はスペースで区切る必要があります。
5. 属性間に順序はありません。
6. パスの説明と画像のクロスレベル挿入
(1) パスの紹介
1.絶対パス
ディレクトリ下の絶対位置はターゲットの場所に直接到達でき、通常はドライブ文字または完全な URL から始まるパスを指します。 HTML 画像の挿入では、一般に絶対パスは使用されず、相対パスがよく使用されます。
2. 相対パス
現在のファイルから開始して目的のファイルを見つけるプロセスがよく使用されます。
(2) レベルをまたいで画像を挿入する
1. 同じレベル
挿入する画像が作成したhtmlファイルと同レベルの場合、srcの属性値が「対象ファイル名.拡張子」または「./対象ファイル名.拡張子」の場合は直接挿入できます。コンパイラを使用してコーディングする場合、同じレベルのファイル名の最初の文字を入力すると、コンパイラが自動的に残りのコンテンツを除外してしまうことがよくあります。
コード表示: (画像の名前が「picture」であり、jpg 形式であると仮定します)
<imgsrc=picture.jpg> または <imgsrc=./picture.jpg>
2. 部下
HTML ファイルがファイル フォルダーと同じレベルにあり、挿入する画像がファイル フォルダー内にある場合、HTML ファイルへの画像の挿入は、レベル間の画像アクセス操作となります。コードは次のとおりです。
<imgsrc=file/picture.jpg>
3. 優れた
total フォルダーと別の test フォルダーに画像があり、html ファイルが test フォルダーにある場合、html ファイルに画像を挿入することは、上位フォルダーへのアクセスに属します。 コードは次のとおりです。
<imgsrc=../picture.jpg>
上の 2 レベルのフォルダー内の画像にアクセスする必要がある場合、コードは次のとおりです。
<imgsrc=../../picture.jpg>
4. 包括的なアプリケーション
file1 と file2 の 2 つのフォルダーがあり、file1 に html ファイルが保存され、file2 に挿入する画像フラグが jpg 形式で保存されている場合、html ファイルにフラグ画像を挿入するコードは次のようになります。
<imgsrc=../file2/flag.jpg>
(最初に前のレベルに戻ってから、次のレベルに移動します)