Gambar yang ditampilkan pada dokumen HTML terkadang tidak memiliki ukuran gambar yang sama dengan ukuran sebenarnya. Untuk menghasilkan gambar dengan kualitas yang mirip aslinya, penentuan ukuran juga menjadi hal yang penting untuk diperhatikan. Maka dari itu perbandinganya harus sesuai dengan ukuran asli dari gambar tersebut. Untuk menentukan ukuran gambar, kita perlu mengisi atribut HEIGHT berfungsi untuk menetukan tinggi gambar dan WIDTH untuk menetukan lebar gambar.<\/p>\n

Perhatikan contoh berikut ini. <img src=\u201dimages\/komputer.jpg\u201d \/>
\n<\/strong>Kode diatas akan menampilkan gambar dari file komputer.jpg yang berada dalam direktori images sesuai dengan ukuran asli (misal 500X375 pixel). Untuk memperkecil gambar tersebut, kita tinggal memperkecil nilai-nilai tersebut, misalnya
\n<img src=images\/komputer.jpg\u201d width=320\u201d height=\u201d230\u201d \/><\/strong><\/p>\n

Memberi keterangan pada gambar<\/strong>
\nAgar lebih terkesan informatif, anda dapat memberikan keterangan yang relevan dan seperlunya (tidak berlebihan) terhadap gambar yang anda tampilkan pada halaman web. Keterangan ini akan muncul dalam bentuk tooltip ( sesaat, hanya beberapa detik) pada saat penunjung mengarahkan kursor (penjujuk mouse) ke atas gambar.
\nUntuk membuat keterangan semacam ini, kita dapat menggunakan atribut TITLE maupun ALT pada tag <img>.
\n<img src=\u201dnamafile\u201d title=\u201dketerangan\u201d\/> <\/strong><\/p>\n

Contoh hasil dokumen HTML di Web Browser seperti gambar berikut :
\n<\/a>
\nGambar 11.4. Menyajikan format gambar dengan keterangan<\/p>\n

Pada gambar di atas dapat dilihat bahwa keterangan gambar terlihat pada saat mouse di atas gambar, di sana tertulis \u201cKomputer Desktop\u201d sebagai keterangan gambar.<\/p>\n","protected":false},"excerpt":{"rendered":"

Gambar yang ditampilkan pada dokumen HTML terkadang tidak memiliki ukuran gambar yang sama dengan ukuran sebenarnya. Untuk menghasilkan gambar dengan kualitas yang mirip aslinya, penentuan ukuran juga menjadi hal yang penting untuk diperhatikan. Maka dari itu perbandinganya harus sesuai dengan ukuran asli dari gambar tersebut. Untuk menentukan ukuran gambar, kita perlu mengisi atribut HEIGHT berfungsi …<\/p>\n","protected":false},"author":1,"featured_media":784,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[845],"tags":[1054,1059,1056,1064,1062,1063,1061,1055,1060,1057,1058],"class_list":["post-786","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-pembuatan-halaman-web","tag-ukuran-gambar","tag-ukuran-gambar-3r","tag-ukuran-gambar-4r","tag-ukuran-gambar-5r","tag-ukuran-gambar-ic","tag-ukuran-gambar-iklan-facebook","tag-ukuran-gambar-kad-pengenalan","tag-ukuran-gambar-pasport","tag-ukuran-gambar-pasport-malaysia","tag-ukuran-gambar-passport-dalam-pixel","tag-ukuran-gambar-untuk-instagram"],"_links":{"self":[{"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/posts\/786","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/comments?post=786"}],"version-history":[{"count":1,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/posts\/786\/revisions"}],"predecessor-version":[{"id":2945,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/posts\/786\/revisions\/2945"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/media\/784"}],"wp:attachment":[{"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/media?parent=786"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/categories?post=786"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tneutron.net\/mikro\/wp-json\/wp\/v2\/tags?post=786"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}