{"id":95,"date":"2022-04-22T20:28:24","date_gmt":"2022-04-22T20:28:24","guid":{"rendered":"https:\/\/gyanipandit.com\/programming\/?p=95"},"modified":"2022-04-22T20:28:24","modified_gmt":"2022-04-22T20:28:24","slug":"html-image-link","status":"publish","type":"post","link":"https:\/\/gyanipandit.com\/programming\/html-image-link\/","title":{"rendered":"HTML Image Link"},"content":{"rendered":"<p style=\"text-align: center;\"><strong>Using Images as Links in HTML<\/strong><\/p>\n<p>Well, just like we can use <a href=\"https:\/\/gyanipandit.com\/programming\/button-as-a-link-in-html\/\" target=\"_blank\" rel=\"noopener\">buttons as links<\/a>, we can also use the images as links. We have to do the same thing, just to write the image inside the tag. Here is the code for using images as links \u2192<\/p>\n<p><strong>&lt;!DOCTYPE html&gt;<br \/>\n&lt;html lang=&#8221;en&#8221;&gt;<br \/>\n&lt;head&gt;<br \/>\n&lt;meta charset=&#8221;UTF-8&#8243;&gt;<br \/>\n&lt;meta http-equiv=&#8221;X-UA-Compatible&#8221; content=&#8221;IE=edge&#8221;&gt;<br \/>\n&lt;meta name=&#8221;viewport&#8221; content=&#8221;width=device-width, initial-scale=1.0&#8243;&gt;<br \/>\n&lt;title&gt;Understanding links&lt;\/title&gt;<br \/>\n&lt;\/head&gt;<br \/>\n&lt;body&gt;<br \/>\n&lt;h1&gt;Find the button below&lt;\/h1&gt;<br \/>\n&lt;a href=&#8221;https:\/\/www.gyanipandit.com\/&#8221;&gt;&lt;img src=&#8221;logo.png&#8221; alt=&#8221;GyaniPandit logo&#8221;&gt;&lt;\/a&gt;<br \/>\n&lt;\/body&gt;<br \/>\n&lt;\/html&gt;<\/strong><\/p>\n<p>Now, we are just expecting an image on the web page, clicking on which, we can move<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-96 size-full\" src=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/using-images-as-links-in-html.jpg\" alt=\"\" width=\"1024\" height=\"234\" srcset=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/using-images-as-links-in-html.jpg 1024w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/using-images-as-links-in-html-300x69.jpg 300w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/using-images-as-links-in-html-768x176.jpg 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>Now, if we click on the GyaniPandit logo, we can see that we go to GyaniPandit. So, this way, we can have the images as links.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Using Images as Links in HTML Well, just like we can use buttons as links, we can also use the images as links. We have to do the same thing, just to write the image inside the tag. Here is the code for using images as links \u2192 &lt;!DOCTYPE html&gt; &lt;html lang=&#8221;en&#8221;&gt; &lt;head&gt; &lt;meta charset=&#8221;UTF-8&#8243;&gt; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":{"0":"post-95","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-html-tutorial"},"_links":{"self":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/95","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/comments?post=95"}],"version-history":[{"count":4,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/95\/revisions"}],"predecessor-version":[{"id":380,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/95\/revisions\/380"}],"wp:attachment":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/media?parent=95"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/categories?post=95"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/tags?post=95"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}