htmlイメージタグ-htmlチュートリアル-php.cn

ホームページ

ウェブフロントエンド

htmlチュートリアル

htmlイメージタグ

无忌哥哥

Jun 29, 2018 am 09:58 AM

画像タグは、おそらく最も大きくて最も興味深いものです。「写真があるところに真実がある」という言葉があります。

ページ内に画像があると、ページがすぐにカラフルになります。ユーザーエクスペリエンスが即座に向上します

ただし、画像は外部リソースであり、現在のページに読み込むのに時間がかかるため、画像は良いものですが、悪用することはできません

うまく使用して仕上げを加え、不適切に使用してください。余計なものを追加します

画像にはタグを使用します。これは前回のフロントエンド体験コースで説明しました

画像は外部リソースであるため、参照するリソースがネットワークからのものである場合、参照が失敗する可能性があります。タイムアウトやその他の理由で読み込みが失敗する可能性があります。

したがって、img も指定する必要があります。タグに alt 属性を追加して、現在の画像のテキスト説明を示します。例: ハイブリッド車のモデル

現在の画像の場合表示できない場合、またはユーザーが画像表示を禁止している場合、このプロンプトテキストが表示されます

このプロンプトテキストは非常に重要です。導入したばかりですが、検索エンジンは画像コンテンツを識別できないため、Baidu

などの検索エンジンに知らせたい場合は、写真が何であるかについては、写真情報が取得されるように alt タグを追加する必要があります。これはウェブサイトの最適化に役立ちます

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>6.图像标签</title>
</head>
<body>
<!-- <img src="../images/9.jpg"> -->
<!-- 发现图片太大了,我们刚才介绍过,img标签还有二个属性可以设置图片的大小 -->
<!-- width:设置宽度, height:设置高度,单位默认为像素,可以不写单位,只有数值 -->
<!-- <img src="../images/9.jpg" width="300px"> -->
<!-- <img src="../images/9.jpg" width="300"> -->
<!-- 宽度与高度写一个就可以,另一个属性会自动等比例缩放的 -->
<img src="../images/9.jpg" width="300" alt="混血车模">
</body>
</html>

ログイン後にコピー

以上がhtmlイメージタグの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。