HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML画像サイズ

HTML画像サイズは、画像の高さと幅を指します。それらは、HTML属性としてにリストされています。 要素。設定方法は次のとおりです。

構文

<img>の幅と高さの属性を設定するための構文 タグは次のとおりです：

<img src="<name of website>" alt="<alt tag>" height="<in px>" width="<in px>" />

これがどのように機能するかを示すコードスニペットです。 

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <h1>Image Size in HTML</h1>
   <h2>without attributes</h2>
   <img src="https://placekitten.com/500/500" />
   <h2>with attributes</h2>
   <img src="https://placekitten.com/500/500" width="300" height="300" />
   <script src="script.js"></script>
 </body>
</html>

<img>の高さと幅 elementは、ピクセル単位の数値（引用符の間）です。 Webページが読み込まれる前にスペースが画像に割り当てられるように、高さと幅の両方の属性を指定することをお勧めします。ページのレンダリング前に画像のサイズが示されていない場合、ページは画像の読み込み時にレイアウトを調整します。

ブラウザのサポート

<img>の幅と高さの属性 elementはすべてのWebブラウザでサポートされています。




  1. HTMLサイズ属性

    HTMLサイズ属性は、選択で表示されるオプション/文字の数を表します および入力 HTML要素。 構文 以下は構文です- <tagname size=”number”></tagname> HTMLサイズ属性の例を見てみましょう- 例 <!DOCTYPE html> <html> <style>    body {       color: #000;       height: 100vh;     &nb

  2. HTMLマッピング画像

    HTMLマッピング画像は、HTMLドキュメントのハイパーリンクとして機能するクリック可能な領域を備えたクライアント側の画像マップです。 マップ間の関係を作成するには およびimg HTML要素マップの名前属性 要素はimgusermap属性に関連付けられています。 構文 以下は構文です- <img src=”” alt=”’ usemap=”#name_value”> <map name=”name_value”> <area shape=””