[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"site-config":3,"course-tree":6,"blog-categories":8,"blog:category:html:page:1":26},{"data":4},{"google_site_verification":5,"ga4_measurement_id":5,"site_name":5,"default_og_image":5,"twitter_handle":5},null,{"data":7},[],{"data":9},[10,16,21],{"name":11,"slug":12,"description":13,"post_count":14,"subcategories":15},"CSS","css","Learn CSS with practical tutorials and examples covering layouts, Flexbox, Grid, responsive design, typography, positioning, animations, and more.",1,[],{"name":17,"slug":18,"description":19,"post_count":14,"subcategories":20},"HTML","html","Learn HTML with practical tutorials and examples for beginners. Explore HTML tags, elements, attributes, links, images, forms, semantic HTML, and more with clear explanations and real code examples.",[],{"name":22,"slug":23,"description":24,"post_count":14,"subcategories":25},"WPF","wpf","Learn WPF with practical tutorials and examples covering XAML, windows, controls, layouts, data binding, MVVM, commands, styles, templates, debugging, and modern WPF UI development.",[],{"data":27,"links":99,"meta":101,"category":113},[28],{"id":29,"title":30,"slug":31,"excerpt":5,"author":32,"categories":38,"featured_image":40,"reading_time_minutes":43,"meta_title":44,"meta_description":45,"og_image":5,"meta_robots":46,"schema_type":47,"faq_json":5,"video_url":5,"toc_json":48,"published_at":97,"updated_at":98},2,"How to Add an Image in HTML: The Complete img Tag Guide","how-to-add-an-image-in-html",{"slug":33,"display_name":34,"job_title":5,"short_bio":5,"expertise_tags":35,"headshot":5,"long_bio":5,"credentials":5,"twitter_url":5,"linkedin_url":5,"github_url":5,"personal_website_url":5,"other_sameas_urls":5,"topics":36,"posts":37},"badar-khalil","Badar Khalil",[],[],[],[39],{"name":17,"slug":18},{"url":41,"alt_text":42,"width":5,"height":5},"\u002Fstorage\u002Fmedia\u002F01M20TNJ8K254FH80P5N6V87PR.webp","How to add an image in HTML using the img tag, responsive images, and alt text",6,"How to Add Image in HTML","Learn how to add image in HTML with the img tag, alt text, relative paths, srcset, and the picture element — plus common mistakes to avoid.",[],"Article",[49,53,57,61,65,69,73,77,81,85,89,93],{"id":50,"text":51,"level":29,"children":52},"the-basic-syntax-for-how-to-add-image-in-html","The Basic Syntax for How to Add Image in HTML",[],{"id":54,"text":55,"level":29,"children":56},"understanding-the-img-tags-core-attributes","Understanding the img Tag's Core Attributes",[],{"id":58,"text":59,"level":29,"children":60},"relative-root-relative-and-absolute-urls-for-images","Relative, Root-Relative, and Absolute URLs for Images",[],{"id":62,"text":63,"level":29,"children":64},"making-images-responsive-with-srcset-and-sizes","Making Images Responsive with srcset and sizes",[],{"id":66,"text":67,"level":29,"children":68},"using-the-picture-element-for-format-fallbacks","Using the picture Element for Format Fallbacks",[],{"id":70,"text":71,"level":29,"children":72},"wrapping-images-with-figure-and-figcaption","Wrapping Images with figure and figcaption",[],{"id":74,"text":75,"level":29,"children":76},"making-an-image-clickable","Making an Image Clickable",[],{"id":78,"text":79,"level":29,"children":80},"lazy-loading-images-for-performance","Lazy Loading Images for Performance",[],{"id":82,"text":83,"level":29,"children":84},"common-mistakes-when-adding-images-in-html","Common Mistakes When Adding Images in HTML",[],{"id":86,"text":87,"level":29,"children":88},"quick-reference-which-approach-fits-your-situation","Quick Reference: Which Approach Fits Your Situation",[],{"id":90,"text":91,"level":29,"children":92},"faq-about-adding-images-in-html","FAQ About Adding Images in HTML",[],{"id":94,"text":95,"level":29,"children":96},"the-short-version","The Short Version",[],"2026-09-08T15:41:06+00:00","2026-09-08T15:41:07+00:00",{"first":100,"last":100,"prev":5,"next":5},"http:\u002F\u002Fapp\u002Fapi\u002Fblog\u002Fcategory\u002Fhtml?page=1",{"current_page":14,"from":14,"last_page":14,"links":102,"path":111,"per_page":112,"to":14,"total":14},[103,106,109],{"url":5,"label":104,"page":5,"active":105},"« Previous",false,{"url":100,"label":107,"page":14,"active":108},"1",true,{"url":5,"label":110,"page":5,"active":105},"Next »","http:\u002F\u002Fapp\u002Fapi\u002Fblog\u002Fcategory\u002Fhtml",9,{"name":17,"slug":18,"description":19,"post_count":14,"parent":5,"meta_title":114,"meta_description":115,"canonical_url":116,"focus_keyword":117,"schema_type":118,"meta_robots":119,"og_image":5},"HTML Tutorials & Guides for Beginners | WPFSharp","Learn HTML with practical tutorials and examples covering tags, elements, attributes, forms, images, links, semantic HTML, and more.","https:\u002F\u002Fwpfsharp.com\u002Fcategory\u002Fhtml\u002F","HTML tutorials","CollectionPage",[]]