{"id":24160,"date":"2022-10-05T13:00:27","date_gmt":"2022-10-05T13:00:27","guid":{"rendered":"https:\/\/kb.hostatom.com\/?p=24160"},"modified":"2025-11-07T08:35:51","modified_gmt":"2025-11-07T08:35:51","slug":"html-responsive-web-design","status":"publish","type":"post","link":"https:\/\/kb.hostatom.com\/lesson\/24160\/","title":{"rendered":"HTML\u00a0Responsive Web Design"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"24160\" class=\"elementor elementor-24160\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4ff473c e-flex e-con-boxed e-con e-parent\" data-id=\"4ff473c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a2cbe1 elementor-widget elementor-widget-text-editor\" data-id=\"3a2cbe1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tResponsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-26181cd elementor-widget elementor-widget-image\" data-id=\"26181cd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"350\" src=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/Devices-homepage.webp\" class=\"attachment-large size-large wp-image-31108\" alt=\"\" srcset=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/Devices-homepage.webp 720w, https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/Devices-homepage-300x146.webp 300w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-060675d elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"060675d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c39c640 elementor-widget elementor-widget-heading\" data-id=\"c39c640\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cb5a224 elementor-widget elementor-widget-text-editor\" data-id=\"cb5a224\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tResponsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c)\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f6b90ba elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"f6b90ba\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8b37938 elementor-widget elementor-widget-heading\" data-id=\"8b37938\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a4e3b6a custcode elementor-widget elementor-widget-text-editor\" data-id=\"a4e3b6a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 <code>&lt;meta&gt;<\/code> \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1ad77ca elementor-widget elementor-widget-text-editor\" data-id=\"1ad77ca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-878341a custcode elementor-widget elementor-widget-code-highlight\" data-id=\"878341a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5dd8b56 elementor-widget elementor-widget-button\" data-id=\"5dd8b56\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_viewport\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0d687cc elementor-widget elementor-widget-text-editor\" data-id=\"0d687cc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bcd2012 elementor-widget elementor-widget-text-editor\" data-id=\"bcd2012\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag\t\t\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-67c99aa e-grid e-con-full e-con e-child\" data-id=\"67c99aa\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b93bfc4 elementor-widget elementor-widget-image\" data-id=\"b93bfc4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"200\" height=\"355\" src=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/non-viewport-1.webp\" class=\"attachment-large size-large wp-image-31109\" alt=\"\" srcset=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/non-viewport-1.webp 200w, https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/non-viewport-1-169x300.webp 169w\" sizes=\"auto, (max-width: 200px) 100vw, 200px\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-03d86fa elementor-widget elementor-widget-image\" data-id=\"03d86fa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t<figure class=\"wp-caption\">\n\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"200\" height=\"355\" src=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/viewport-1.webp\" class=\"attachment-large size-large wp-image-31110\" alt=\"\" srcset=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/viewport-1.webp 200w, https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/viewport-1-169x300.webp 169w\" sizes=\"auto, (max-width: 200px) 100vw, 200px\" \/>\t\t\t\t\t\t\t\t\t\t\t<figcaption class=\"widget-image-caption wp-caption-text\">\u0e21\u0e35 Viewport Meta Tag<\/figcaption>\n\t\t\t\t\t\t\t\t\t\t<\/figure>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d4cbef elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"5d4cbef\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4b626ea elementor-widget elementor-widget-heading\" data-id=\"4b626ea\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Responsive Images<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6e56af4 elementor-widget elementor-widget-text-editor\" data-id=\"6e56af4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tResponsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0720407 elementor-widget elementor-widget-heading\" data-id=\"0720407\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bfa8782 custcode elementor-widget elementor-widget-text-editor\" data-id=\"bfa8782\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49 <code>&lt;width&gt;<\/code> \u0e40\u0e1b\u0e47\u0e19 100% \u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e08\u0e30\u0e15\u0e2d\u0e1a\u0e2a\u0e19\u0e2d\u0e07\u0e41\u0e25\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e36\u0e49\u0e19\u0e41\u0e25\u0e30\u0e25\u0e07\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-482f197 elementor-widget elementor-widget-text-editor\" data-id=\"482f197\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fdf7018 elementor-widget elementor-widget-code-highlight\" data-id=\"fdf7018\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard word-wrap\">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n<head>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<\/head>\r\n<body>\r\n\r\n<h2>Responsive Image<\/h2>\r\n<p>\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e43\u0e0a\u0e49\u0e04\u0e38\u0e13\u0e2a\u0e21\u0e1a\u0e31\u0e15\u0e34\u0e02\u0e2d\u0e07 Tag width \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e40\u0e1b\u0e47\u0e19\u0e04\u0e48\u0e32\u0e40\u0e1b\u0e2d\u0e23\u0e4c\u0e40\u0e0b\u0e47\u0e19\u0e15\u0e4c \u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e08\u0e30\u0e02\u0e22\u0e32\u0e22\u0e02\u0e19\u0e32\u0e14\u0e02\u0e36\u0e49\u0e19\u0e41\u0e25\u0e30\u0e25\u0e07\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c \u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/p>\r\n\r\n<img src=\"images\/img_girl.jpg\" style=\"width:100%;\">\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bc21ed9 elementor-widget elementor-widget-button\" data-id=\"bc21ed9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_image\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3df54bc custcode elementor-widget elementor-widget-text-editor\" data-id=\"3df54bc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e42\u0e1b\u0e23\u0e14\u0e2a\u0e31\u0e07\u0e40\u0e01\u0e15\u0e27\u0e48\u0e32\u0e43\u0e19\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e43\u0e2b\u0e49\u0e43\u0e2b\u0e0d\u0e48\u0e01\u0e27\u0e48\u0e32\u0e02\u0e19\u0e32\u0e14\u0e14\u0e31\u0e49\u0e07\u0e40\u0e14\u0e34\u0e21\u0e44\u0e14\u0e49 <br \/>\u0e40\u0e1b\u0e47\u0e19\u0e14\u0e35\u0e01\u0e27\u0e48\u0e32\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 <code>&lt;max-width&gt;<\/code>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b3e11ec elementor-widget elementor-widget-heading\" data-id=\"b3e11ec\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e04\u0e38\u0e13\u0e2a\u0e21\u0e1a\u0e31\u0e15\u0e34 max-width<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0a73dc9 custcode elementor-widget elementor-widget-text-editor\" data-id=\"0a73dc9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e2b\u0e32\u0e01\u0e43\u0e0a\u0e49 <code>&lt;max-width&gt;<\/code> \u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e04\u0e38\u0e13\u0e2a\u0e21\u0e1a\u0e31\u0e15\u0e34\u0e40\u0e1b\u0e47\u0e19 100% \u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e08\u0e30\u0e22\u0e48\u0e2d\u0e02\u0e19\u0e32\u0e14\u0e25\u0e07\u0e2b\u0e32\u0e01\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19 \u0e41\u0e15\u0e48\u0e08\u0e30\u0e44\u0e21\u0e48\u0e02\u0e22\u0e32\u0e22\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e43\u0e2b\u0e0d\u0e48\u0e01\u0e27\u0e48\u0e32\u0e23\u0e39\u0e1b\u0e02\u0e19\u0e32\u0e14\u0e14\u0e31\u0e49\u0e07\u0e40\u0e14\u0e34\u0e21\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-62810cf elementor-widget elementor-widget-text-editor\" data-id=\"62810cf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-38111fc elementor-widget elementor-widget-code-highlight\" data-id=\"38111fc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard word-wrap\">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n<head>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<\/head>\r\n<body>\r\n\r\n<h2>Responsive Image<\/h2>\r\n<p>\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e43\u0e0a\u0e49\u0e04\u0e38\u0e13\u0e2a\u0e21\u0e1a\u0e31\u0e15\u0e34\u0e02\u0e2d\u0e07 Tag width \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e40\u0e1b\u0e47\u0e19\u0e04\u0e48\u0e32\u0e40\u0e1b\u0e2d\u0e23\u0e4c\u0e40\u0e0b\u0e47\u0e19\u0e15\u0e4c \u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e08\u0e30\u0e02\u0e22\u0e32\u0e22\u0e02\u0e19\u0e32\u0e14\u0e02\u0e36\u0e49\u0e19\u0e41\u0e25\u0e30\u0e25\u0e07\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c \u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/p>\r\n\r\n<img src=\"images\/img_girl.jpg\" style=\"width:100%;\">\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-287bbc3 elementor-widget elementor-widget-button\" data-id=\"287bbc3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_image_maxwidth\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ce8d508 elementor-widget elementor-widget-heading\" data-id=\"ce8d508\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">\u0e41\u0e2a\u0e14\u0e07\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e43\u0e2b\u0e49\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fdd822c custcode elementor-widget elementor-widget-text-editor\" data-id=\"fdd822c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Element HTML <code>&lt;picture&gt;<\/code> \u0e0a\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e49\u0e04\u0e38\u0e13\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e15\u0e48\u0e32\u0e07\u0e46<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-541aa21 elementor-widget elementor-widget-text-editor\" data-id=\"541aa21\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e25\u0e2d\u0e07\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e27\u0e48\u0e32\u0e20\u0e32\u0e1e\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e41\u0e1b\u0e25\u0e07\u0e44\u0e1b\u0e15\u0e32\u0e21\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\n\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-79ad181 elementor-widget elementor-widget-text-editor\" data-id=\"79ad181\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6ca69be elementor-widget elementor-widget-code-highlight\" data-id=\"6ca69be\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard word-wrap\">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n<head>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<\/head>\r\n<body>\r\n\r\n<h2>\u0e41\u0e2a\u0e14\u0e07\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c<\/h2>\r\n<p>\u0e25\u0e2d\u0e07\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e41\u0e25\u0e30\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e08\u0e30\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e17\u0e35\u0e48\u0e02\u0e19\u0e32\u0e14 600px \u0e41\u0e25\u0e30 1500px<\/p>\r\n\r\n<picture>\r\n  <source srcset=\"images\/img_smallflower.jpg\" media=\"(max-width: 600px)\">\r\n  <source srcset=\"images\/img_flowers.jpg\" media=\"(max-width: 1500px)\">\r\n  <source srcset=\"images\/flowers.jpg\">\r\n  <img src=\"images\/img_flowers.jpg\" alt=\"Flowers\" style=\"width:auto;\">\r\n<\/picture>\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c0b49e7 elementor-widget elementor-widget-button\" data-id=\"c0b49e7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_picture\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1220347 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"1220347\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5bd3642 elementor-widget elementor-widget-heading\" data-id=\"5bd3642\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Responsive Text Size<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-097f2b9 elementor-widget elementor-widget-text-editor\" data-id=\"097f2b9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e02\u0e19\u0e32\u0e14\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e44\u0e14\u0e49\u0e14\u0e49\u0e27\u0e22\u0e2b\u0e19\u0e48\u0e27\u0e22 \u201c<code>vw<\/code>\u201d \u0e0b\u0e36\u0e48\u0e07\u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 \u201c\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u201d\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-518ec95 elementor-widget elementor-widget-text-editor\" data-id=\"518ec95\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e14\u0e49\u0e27\u0e22\u0e27\u0e34\u0e18\u0e35\u0e19\u0e35\u0e49\u0e02\u0e19\u0e32\u0e14\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1b\u0e15\u0e32\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\n\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ef1c122 elementor-widget elementor-widget-text-editor\" data-id=\"ef1c122\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d9c294a elementor-widget elementor-widget-code-highlight\" data-id=\"d9c294a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard word-wrap\">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n<head>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<\/head>\r\n<body>\r\n\r\n<h1 style=\"font-size:10vw;\">Responsive Text<\/h1>\r\n<p style=\"font-size:5vw;\">\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e27\u0e48\u0e32\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23<\/p>\r\n<p style=\"font-size:5vw;\">\u0e43\u0e0a\u0e49\u0e2b\u0e19\u0e48\u0e27\u0e22 \"vw\" \u0e40\u0e21\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21 10vw \u0e08\u0e30\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1b\u0e47\u0e19 10% \u0e02\u0e2d\u0e07\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07 viewport<\/p>\r\n<p>viewport \u0e04\u0e37\u0e2d\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c 1vw = 1% \u0e02\u0e2d\u0e07\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15 \u0e16\u0e49\u0e32 viewport \u0e01\u0e27\u0e49\u0e32\u0e07 50 \u0e0b\u0e21. 1vw \u0e04\u0e37\u0e2d 0.5 \u0e0b\u0e21.<\/p>\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-68f8059 elementor-widget elementor-widget-button\" data-id=\"68f8059\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_text\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8c255ca elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"8c255ca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9cf5e43 elementor-widget elementor-widget-heading\" data-id=\"9cf5e43\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Media Queries\n<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0a3401d elementor-widget elementor-widget-text-editor\" data-id=\"0a3401d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tMedia Queries \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e36\u0e48\u0e07\u0e43\u0e19\u0e27\u0e34\u0e18\u0e35\u0e01\u0e32\u0e23\u0e17\u0e33\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c Responsive \u0e04\u0e38\u0e13\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e01\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\n\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-55e0754 elementor-widget elementor-widget-code-highlight\" data-id=\"55e0754\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html>\r\n<head>\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<style>\r\n* {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.left {\r\n  background-color: #2196F3;\r\n  padding: 20px;\r\n  float: left;\r\n  width: 20%; \/* The width is 20%, by default *\/\r\n}\r\n\r\n.main {\r\n  background-color: #f1f1f1;\r\n  padding: 20px;\r\n  float: left;\r\n  width: 60%; \/* The width is 60%, by default *\/\r\n}\r\n\r\n.right {\r\n  background-color: #04AA6D;\r\n  padding: 20px;\r\n  float: left;\r\n  width: 20%; \/* The width is 20%, by default *\/\r\n}\r\n\r\n\/* Use a media query to add a break point at 800px: *\/\r\n@media screen and (max-width: 800px) {\r\n  .left, .main, .right {\r\n    width: 100%; \/* The width is 100%, when the viewport is 800px or smaller *\/\r\n  }\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<h2>Media Queries<\/h2>\r\n<p>\u0e25\u0e2d\u0e07\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e21\u0e19\u0e39<\/p>\r\n\r\n<p>\u0e40\u0e0a\u0e47\u0e04\u0e43\u0e2b\u0e49\u0e0a\u0e31\u0e27\u0e23\u0e4c\u0e27\u0e48\u0e32\u0e04\u0e38\u0e13\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e15\u0e48\u0e33\u0e01\u0e27\u0e48\u0e32 800px \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e41\u0e1b\u0e25\u0e07<\/p>\r\n\r\n<div class=\"left\">\r\n  <p>\u0e40\u0e21\u0e19\u0e39\u0e14\u0e49\u0e32\u0e19\u0e0b\u0e49\u0e32\u0e22<\/p>\r\n<\/div>\r\n\r\n<div class=\"main\">\r\n  <p>\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e2b\u0e25\u0e31\u0e01<\/p>\r\n<\/div>\r\n\r\n<div class=\"right\">\r\n  <p>\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e14\u0e49\u0e32\u0e19\u0e02\u0e27\u0e32<\/p>\r\n<\/div>\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-622f271 elementor-widget elementor-widget-button\" data-id=\"622f271\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_media_query\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-right\" viewBox=\"0 0 256 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-492e21b elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"492e21b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-81b2f3d elementor-widget elementor-widget-heading\" data-id=\"81b2f3d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Responsive Web Design \u2013 Frameworks<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6c2cb84 elementor-widget elementor-widget-text-editor\" data-id=\"6c2cb84\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tCSS Frameworks \u0e22\u0e2d\u0e14\u0e2e\u0e34\u0e15\u0e2a\u0e48\u0e27\u0e19\u0e43\u0e2b\u0e0d\u0e48\u0e23\u0e2d\u0e07\u0e23\u0e31\u0e1a Responsive Design \u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e07\u0e48\u0e32\u0e22\u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e1f\u0e23\u0e35\n\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-46b3bd6 elementor-widget elementor-widget-heading\" data-id=\"46b3bd6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Bootstrap<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f00d18b elementor-widget elementor-widget-text-editor\" data-id=\"f00d18b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tFramework CSS \u0e22\u0e2d\u0e14\u0e19\u0e34\u0e22\u0e21\u0e2d\u0e35\u0e01\u0e15\u0e31\u0e27\u0e2b\u0e19\u0e36\u0e48\u0e07\u0e04\u0e37\u0e2d Bootstrap \u0e43\u0e0a\u0e49 HTML, CSS \u0e41\u0e25\u0e30 jQuery \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e2a\u0e23\u0e49\u0e32\u0e07 Responsive Web Pages\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1710ec5 elementor-widget elementor-widget-text-editor\" data-id=\"1710ec5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-abdaf7f elementor-widget elementor-widget-code-highlight\" data-id=\"abdaf7f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-html line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-html\">\n\t\t\t\t\t<xmp><!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n  <title>Bootstrap Example<\/title>\r\n  <meta charset=\"utf-8\">\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\r\n  <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.2.3\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\r\n  <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.2.3\/dist\/js\/bootstrap.bundle.min.js\"><\/script>\r\n  <\/head>\r\n<body>\r\n\r\n<div class=\"container-fluid p-5 bg-primary text-white text-center\">\r\n  <h1>Bootstrap Page<\/h1>\r\n  <p>\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/p> \r\n<\/div>\r\n  \r\n<div class=\"container mt-5\">\r\n  <div class=\"row\">\r\n    <div class=\"col-sm-4\">\r\n      <h3>\u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c 1<\/h3>\r\n      <p>\u0e42\u0e1b\u0e23\u0e40\u0e08\u0e47\u0e01\u0e40\u0e15\u0e2d\u0e23\u0e4c\u0e40\u0e27\u0e40\u0e1f\u0e2d\u0e23\u0e4c \u0e04\u0e2d\u0e19\u0e41\u0e17\u0e04\u0e42\u0e1b\u0e25\u0e34\u0e28 \u0e0b\u0e34\u0e21 \u0e19\u0e2d\u0e23\u0e4c\u0e17\u0e23\u0e32\u0e40\u0e21\u0e19\u0e2a\u0e40\u0e01\u0e47\u0e15\u0e0a\u0e4c\u0e04\u0e39\u0e25\u0e40\u0e25\u0e2d\u0e23\u0e4c...<\/p>\r\n      <p>\u0e20\u0e39\u0e21\u0e34\u0e17\u0e31\u0e28\u0e19\u0e4c\u0e27\u0e32\u0e23\u0e34\u0e0a\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e07\u0e44\u0e1f\u0e15\u0e4c \u0e2a\u0e2b\u0e31\u0e2a\u0e27\u0e23\u0e23\u0e29\u0e40\u0e1a\u0e0d\u0e08\u0e21\u0e1a\u0e1e\u0e34\u0e15\u0e23 \u0e2a\u0e25\u0e31\u0e21\u0e42\u0e04\u0e49\u0e0a\u0e2a\u0e30\u0e1a\u0e36\u0e21\u0e2a\u0e4c\u0e40\u0e1f\u0e23\u0e21 \u0e44\u0e25\u0e1f\u0e4c \u0e41\u0e1e\u0e19\u0e07\u0e40\u0e0a\u0e34\u0e0d\u0e08\u0e34\u0e4a\u0e01...<\/p>\r\n    <\/div>\r\n    <div class=\"col-sm-4\">\r\n      <h3>\u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c 2<\/h3>\r\n      <p>\u0e42\u0e1b\u0e23\u0e40\u0e08\u0e47\u0e01\u0e40\u0e15\u0e2d\u0e23\u0e4c\u0e40\u0e27\u0e40\u0e1f\u0e2d\u0e23\u0e4c \u0e04\u0e2d\u0e19\u0e41\u0e17\u0e04\u0e42\u0e1b\u0e25\u0e34\u0e28 \u0e0b\u0e34\u0e21 \u0e19\u0e2d\u0e23\u0e4c\u0e17\u0e23\u0e32\u0e40\u0e21\u0e19\u0e2a\u0e40\u0e01\u0e47\u0e15\u0e0a\u0e4c\u0e04\u0e39\u0e25\u0e40\u0e25\u0e2d\u0e23\u0e4c...<\/p>\r\n      <p>\u0e20\u0e39\u0e21\u0e34\u0e17\u0e31\u0e28\u0e19\u0e4c\u0e27\u0e32\u0e23\u0e34\u0e0a\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e07\u0e44\u0e1f\u0e15\u0e4c \u0e2a\u0e2b\u0e31\u0e2a\u0e27\u0e23\u0e23\u0e29\u0e40\u0e1a\u0e0d\u0e08\u0e21\u0e1a\u0e1e\u0e34\u0e15\u0e23 \u0e2a\u0e25\u0e31\u0e21\u0e42\u0e04\u0e49\u0e0a\u0e2a\u0e30\u0e1a\u0e36\u0e21\u0e2a\u0e4c\u0e40\u0e1f\u0e23\u0e21 \u0e44\u0e25\u0e1f\u0e4c \u0e41\u0e1e\u0e19\u0e07\u0e40\u0e0a\u0e34\u0e0d\u0e08\u0e34\u0e4a\u0e01...<\/p>\r\n    <\/div>\r\n    <div class=\"col-sm-4\">\r\n      <h3>\u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c 3<\/h3>\r\n      <p>\u0e42\u0e1b\u0e23\u0e40\u0e08\u0e47\u0e01\u0e40\u0e15\u0e2d\u0e23\u0e4c\u0e40\u0e27\u0e40\u0e1f\u0e2d\u0e23\u0e4c \u0e04\u0e2d\u0e19\u0e41\u0e17\u0e04\u0e42\u0e1b\u0e25\u0e34\u0e28 \u0e0b\u0e34\u0e21 \u0e19\u0e2d\u0e23\u0e4c\u0e17\u0e23\u0e32\u0e40\u0e21\u0e19\u0e2a\u0e40\u0e01\u0e47\u0e15\u0e0a\u0e4c\u0e04\u0e39\u0e25\u0e40\u0e25\u0e2d\u0e23\u0e4c...<\/p>\r\n      <p>\u0e20\u0e39\u0e21\u0e34\u0e17\u0e31\u0e28\u0e19\u0e4c\u0e27\u0e32\u0e23\u0e34\u0e0a\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e07\u0e44\u0e1f\u0e15\u0e4c \u0e2a\u0e2b\u0e31\u0e2a\u0e27\u0e23\u0e23\u0e29\u0e40\u0e1a\u0e0d\u0e08\u0e21\u0e1a\u0e1e\u0e34\u0e15\u0e23 \u0e2a\u0e25\u0e31\u0e21\u0e42\u0e04\u0e49\u0e0a\u0e2a\u0e30\u0e1a\u0e36\u0e21\u0e2a\u0e4c\u0e40\u0e1f\u0e23\u0e21 \u0e44\u0e25\u0e1f\u0e4c \u0e41\u0e1e\u0e19\u0e07\u0e40\u0e0a\u0e34\u0e0d\u0e08\u0e34\u0e4a\u0e01...<\/p>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<\/body>\r\n<\/html><\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4d03d3e elementor-widget elementor-widget-button\" data-id=\"4d03d3e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/kb.hostatom.com\/lesson\/html\/tryhtml?filename=responsive_bootstrap\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-external-link-alt\" viewBox=\"0 0 512 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M432,320H400a16,16,0,0,0-16,16V448H64V128H208a16,16,0,0,0,16-16V80a16,16,0,0,0-16-16H48A48,48,0,0,0,0,112V464a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V336A16,16,0,0,0,432,320ZM488,0h-128c-21.37,0-32.05,25.91-17,41l35.73,35.73L135,320.37a24,24,0,0,0,0,34L157.67,377a24,24,0,0,0,34,0L435.28,133.32,471,169c15,15,41,4.5,41-17V24A24,24,0,0,0,488,0Z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">\u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 &lt;meta&gt; \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-24160","post","type-post","status-publish","format-standard","hentry","category-html"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO Pro 5.0.2 - aioseo.com -->\n\t<meta name=\"description\" content=\"Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 \u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width \u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"atom\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/kb.hostatom.com\/lesson\/24160\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO Pro (AIOSEO) 5.0.2\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n\t\t<meta name=\"twitter:title\" content=\"HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom\" \/>\n\t\t<meta name=\"twitter:description\" content=\"Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 \u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width \u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49\" \/>\n\t\t<meta name=\"twitter:image\" content=\"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2025\/09\/hostatom-w-logo.webp\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"BlogPosting\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#blogposting\",\"name\":\"HTML Responsive Web Design - \\u0e1a\\u0e17\\u0e40\\u0e23\\u0e35\\u0e22\\u0e19 | hostatom\",\"headline\":\"HTML\\u00a0Responsive Web Design\",\"author\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/author\\\/atom\\\/#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#organization\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/wp-content\\\/uploads\\\/2023\\\/02\\\/Devices-homepage.webp\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#articleImage\",\"width\":720,\"height\":350},\"datePublished\":\"2022-10-05T13:00:27+00:00\",\"dateModified\":\"2025-11-07T08:35:51+00:00\",\"inLanguage\":\"en-US\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#webpage\"},\"articleSection\":\"HTML\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/category\\\/html\\\/#listItem\",\"name\":\"HTML\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/category\\\/html\\\/#listItem\",\"position\":2,\"name\":\"HTML\",\"item\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/category\\\/html\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#listItem\",\"name\":\"HTML\\u00a0Responsive Web Design\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#listItem\",\"position\":3,\"name\":\"HTML\\u00a0Responsive Web Design\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/category\\\/html\\\/#listItem\",\"name\":\"HTML\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#organization\",\"name\":\"\\u0e1a\\u0e17\\u0e40\\u0e23\\u0e35\\u0e22\\u0e19 | hostatom\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/wp-content\\\/uploads\\\/2025\\\/09\\\/hostatom-w-logo.webp\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#organizationLogo\",\"width\":319,\"height\":69},\"image\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#organizationLogo\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/author\\\/atom\\\/#author\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/author\\\/atom\\\/\",\"name\":\"atom\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/1398e885f2c093231db5c45d2e6565274f768e57b8404e4a7585bb8714b69ec3?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"atom\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#webpage\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/\",\"name\":\"HTML Responsive Web Design - \\u0e1a\\u0e17\\u0e40\\u0e23\\u0e35\\u0e22\\u0e19 | hostatom\",\"description\":\"Responsive Web Design \\u0e04\\u0e37\\u0e2d\\u0e01\\u0e32\\u0e23\\u0e2a\\u0e23\\u0e49\\u0e32\\u0e07\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e17\\u0e35\\u0e48\\u0e41\\u0e2a\\u0e14\\u0e07\\u0e1c\\u0e25\\u0e44\\u0e14\\u0e49\\u0e40\\u0e2b\\u0e21\\u0e32\\u0e30\\u0e2a\\u0e21\\u0e01\\u0e31\\u0e1a\\u0e17\\u0e38\\u0e01\\u0e2d\\u0e38\\u0e1b\\u0e01\\u0e23\\u0e13\\u0e4c \\u0e0b\\u0e36\\u0e48\\u0e07\\u0e08\\u0e30\\u0e21\\u0e35\\u0e01\\u0e32\\u0e23\\u0e1b\\u0e23\\u0e31\\u0e1a\\u0e02\\u0e19\\u0e32\\u0e14\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e08\\u0e2d\\u0e41\\u0e2a\\u0e14\\u0e07\\u0e1c\\u0e25\\u0e02\\u0e2d\\u0e07\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e44\\u0e0b\\u0e15\\u0e4c (Viewport) \\u0e42\\u0e14\\u0e22\\u0e2d\\u0e31\\u0e15\\u0e42\\u0e19\\u0e21\\u0e31\\u0e15\\u0e34 Responsive Web Design \\u0e04\\u0e37\\u0e2d\\u0e2d\\u0e30\\u0e44\\u0e23 ? Responsive Web Design \\u0e04\\u0e37\\u0e2d\\u0e01\\u0e32\\u0e23\\u0e43\\u0e0a\\u0e49 HTML \\u0e41\\u0e25\\u0e30 CSS \\u0e40\\u0e1e\\u0e37\\u0e48\\u0e2d\\u0e1b\\u0e23\\u0e31\\u0e1a\\u0e02\\u0e19\\u0e32\\u0e14, \\u0e0b\\u0e48\\u0e2d\\u0e19, \\u0e22\\u0e48\\u0e2d\\\/\\u0e02\\u0e22\\u0e32\\u0e22 \\u0e40\\u0e27\\u0e47\\u0e1a\\u0e44\\u0e0b\\u0e15\\u0e4c\\u0e2d\\u0e31\\u0e15\\u0e42\\u0e19\\u0e21\\u0e31\\u0e15\\u0e34\\u0e17\\u0e33\\u0e43\\u0e2b\\u0e49\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e44\\u0e0b\\u0e15\\u0e4c\\u0e14\\u0e39\\u0e14\\u0e35\\u0e43\\u0e19\\u0e17\\u0e38\\u0e01\\u0e02\\u0e19\\u0e32\\u0e14 (\\u0e40\\u0e14\\u0e2a\\u0e01\\u0e4c\\u0e17\\u0e47\\u0e2d\\u0e1b \\u0e41\\u0e17\\u0e47\\u0e1a\\u0e40\\u0e25\\u0e47\\u0e15 \\u0e41\\u0e25\\u0e30\\u0e42\\u0e17\\u0e23\\u0e28\\u0e31\\u0e1e\\u0e17\\u0e4c) \\u0e01\\u0e32\\u0e23\\u0e15\\u0e31\\u0e49\\u0e07\\u0e04\\u0e48\\u0e32 Viewport \\u0e43\\u0e19\\u0e01\\u0e32\\u0e23\\u0e17\\u0e35\\u0e48\\u0e08\\u0e30\\u0e17\\u0e33 Responsive Website \\u0e04\\u0e38\\u0e13\\u0e04\\u0e27\\u0e23\\u0e08\\u0e30\\u0e40\\u0e1e\\u0e34\\u0e48\\u0e21\\u0e41\\u0e17\\u0e47\\u0e01 \\u0e43\\u0e19\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e02\\u0e2d\\u0e07\\u0e04\\u0e38\\u0e13 \\u0e15\\u0e31\\u0e27\\u0e2d\\u0e22\\u0e48\\u0e32\\u0e07 \\u0e14\\u0e39\\u0e1c\\u0e25\\u0e25\\u0e31\\u0e1e\\u0e18\\u0e4c \\u0e01\\u0e32\\u0e23\\u0e15\\u0e31\\u0e49\\u0e07\\u0e04\\u0e48\\u0e32\\u0e27\\u0e34\\u0e27\\u0e1e\\u0e2d\\u0e23\\u0e4c\\u0e15\\u0e02\\u0e2d\\u0e07\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e08\\u0e30\\u0e43\\u0e2b\\u0e49\\u0e04\\u0e33\\u0e41\\u0e19\\u0e30\\u0e19\\u0e33\\u0e41\\u0e01\\u0e48\\u0e40\\u0e1a\\u0e23\\u0e32\\u0e27\\u0e4c\\u0e40\\u0e0b\\u0e2d\\u0e23\\u0e4c\\u0e40\\u0e01\\u0e35\\u0e48\\u0e22\\u0e27\\u0e01\\u0e31\\u0e1a\\u0e27\\u0e34\\u0e18\\u0e35\\u0e04\\u0e27\\u0e1a\\u0e04\\u0e38\\u0e21\\u0e02\\u0e19\\u0e32\\u0e14\\u0e02\\u0e2d\\u0e07\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a \\u0e19\\u0e35\\u0e48\\u0e04\\u0e37\\u0e2d\\u0e15\\u0e31\\u0e27\\u0e2d\\u0e22\\u0e48\\u0e32\\u0e07\\u0e02\\u0e2d\\u0e07\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e17\\u0e35\\u0e48\\u0e44\\u0e21\\u0e48\\u0e21\\u0e35 Viewport Meta Tag \\u0e01\\u0e31\\u0e1a\\u0e2b\\u0e19\\u0e49\\u0e32\\u0e40\\u0e27\\u0e47\\u0e1a\\u0e17\\u0e35\\u0e48\\u0e21\\u0e35 Viewport Meta Tag Responsive Images Responsive Images \\u0e04\\u0e37\\u0e2d\\u0e23\\u0e39\\u0e1b\\u0e20\\u0e32\\u0e1e\\u0e17\\u0e35\\u0e48\\u0e1b\\u0e23\\u0e31\\u0e1a\\u0e02\\u0e19\\u0e32\\u0e14\\u0e43\\u0e2b\\u0e49\\u0e1e\\u0e2d\\u0e14\\u0e35\\u0e01\\u0e31\\u0e1a\\u0e40\\u0e1a\\u0e23\\u0e32\\u0e27\\u0e4c\\u0e40\\u0e0b\\u0e2d\\u0e23\\u0e4c\\u0e17\\u0e38\\u0e01\\u0e02\\u0e19\\u0e32\\u0e14 \\u0e01\\u0e32\\u0e23\\u0e43\\u0e0a\\u0e49 Tag Width \\u0e16\\u0e49\\u0e32\\u0e43\\u0e0a\\u0e49\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/24160\\\/#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/author\\\/atom\\\/#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/author\\\/atom\\\/#author\"},\"datePublished\":\"2022-10-05T13:00:27+00:00\",\"dateModified\":\"2025-11-07T08:35:51+00:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#website\",\"url\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/\",\"name\":\"\\u0e1a\\u0e17\\u0e40\\u0e23\\u0e35\\u0e22\\u0e19 | hostatom\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/kb.hostatom.com\\\/lesson\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO Pro -->\r\n\t\t<title>HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom<\/title>\n\n","aioseo_head_json":{"title":"HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","description":"Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 \u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width \u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49","canonical_url":"https:\/\/kb.hostatom.com\/lesson\/24160\/","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"BlogPosting","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#blogposting","name":"HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","headline":"HTML\u00a0Responsive Web Design","author":{"@id":"https:\/\/kb.hostatom.com\/lesson\/author\/atom\/#author"},"publisher":{"@id":"https:\/\/kb.hostatom.com\/lesson\/#organization"},"image":{"@type":"ImageObject","url":"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2023\/02\/Devices-homepage.webp","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#articleImage","width":720,"height":350},"datePublished":"2022-10-05T13:00:27+00:00","dateModified":"2025-11-07T08:35:51+00:00","inLanguage":"en-US","mainEntityOfPage":{"@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#webpage"},"isPartOf":{"@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#webpage"},"articleSection":"HTML"},{"@type":"BreadcrumbList","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/#listItem","position":1,"name":"Home","item":"https:\/\/kb.hostatom.com\/lesson\/","nextItem":{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/category\/html\/#listItem","name":"HTML"}},{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/category\/html\/#listItem","position":2,"name":"HTML","item":"https:\/\/kb.hostatom.com\/lesson\/category\/html\/","nextItem":{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#listItem","name":"HTML\u00a0Responsive Web Design"},"previousItem":{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#listItem","position":3,"name":"HTML\u00a0Responsive Web Design","previousItem":{"@type":"ListItem","@id":"https:\/\/kb.hostatom.com\/lesson\/category\/html\/#listItem","name":"HTML"}}]},{"@type":"Organization","@id":"https:\/\/kb.hostatom.com\/lesson\/#organization","name":"\u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","url":"https:\/\/kb.hostatom.com\/lesson\/","logo":{"@type":"ImageObject","url":"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2025\/09\/hostatom-w-logo.webp","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#organizationLogo","width":319,"height":69},"image":{"@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#organizationLogo"}},{"@type":"Person","@id":"https:\/\/kb.hostatom.com\/lesson\/author\/atom\/#author","url":"https:\/\/kb.hostatom.com\/lesson\/author\/atom\/","name":"atom","image":{"@type":"ImageObject","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/1398e885f2c093231db5c45d2e6565274f768e57b8404e4a7585bb8714b69ec3?s=96&d=mm&r=g","width":96,"height":96,"caption":"atom"}},{"@type":"WebPage","@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#webpage","url":"https:\/\/kb.hostatom.com\/lesson\/24160\/","name":"HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","description":"Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 \u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width \u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/kb.hostatom.com\/lesson\/#website"},"breadcrumb":{"@id":"https:\/\/kb.hostatom.com\/lesson\/24160\/#breadcrumblist"},"author":{"@id":"https:\/\/kb.hostatom.com\/lesson\/author\/atom\/#author"},"creator":{"@id":"https:\/\/kb.hostatom.com\/lesson\/author\/atom\/#author"},"datePublished":"2022-10-05T13:00:27+00:00","dateModified":"2025-11-07T08:35:51+00:00"},{"@type":"WebSite","@id":"https:\/\/kb.hostatom.com\/lesson\/#website","url":"https:\/\/kb.hostatom.com\/lesson\/","name":"\u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","inLanguage":"en-US","publisher":{"@id":"https:\/\/kb.hostatom.com\/lesson\/#organization"}}]},"twitter:card":"summary_large_image","twitter:title":"HTML Responsive Web Design - \u0e1a\u0e17\u0e40\u0e23\u0e35\u0e22\u0e19 | hostatom","twitter:description":"Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e17\u0e38\u0e01\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e21\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Viewport) \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 Responsive Web Design \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 ? Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 HTML \u0e41\u0e25\u0e30 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14, \u0e0b\u0e48\u0e2d\u0e19, \u0e22\u0e48\u0e2d\/\u0e02\u0e22\u0e32\u0e22 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 (\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b \u0e41\u0e17\u0e47\u0e1a\u0e40\u0e25\u0e47\u0e15 \u0e41\u0e25\u0e30\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c) \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32 Viewport \u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33 Responsive Website \u0e04\u0e38\u0e13\u0e04\u0e27\u0e23\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e17\u0e47\u0e01 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e14\u0e39\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c \u0e01\u0e32\u0e23\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e27\u0e34\u0e27\u0e1e\u0e2d\u0e23\u0e4c\u0e15\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e04\u0e33\u0e41\u0e19\u0e30\u0e19\u0e33\u0e41\u0e01\u0e48\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e27\u0e34\u0e18\u0e35\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35 Viewport Meta Tag \u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e17\u0e35\u0e48\u0e21\u0e35 Viewport Meta Tag Responsive Images Responsive Images \u0e04\u0e37\u0e2d\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e1e\u0e2d\u0e14\u0e35\u0e01\u0e31\u0e1a\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e17\u0e38\u0e01\u0e02\u0e19\u0e32\u0e14 \u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 Tag Width \u0e16\u0e49\u0e32\u0e43\u0e0a\u0e49","twitter:image":"https:\/\/kb.hostatom.com\/lesson\/wp-content\/uploads\/2025\/09\/hostatom-w-logo.webp"},"aioseo_meta_data":{"post_id":"24160","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":"default","schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":"2026-08-18 05:20:08","breadcrumb_settings":null,"limit_modified_date":false,"open_ai":null,"ai":null,"created":"2026-02-19 04:48:55","updated":"2026-08-18 05:20:08","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t<a href=\"https:\/\/kb.hostatom.com\/lesson\/\" title=\"Home\">Home<\/a>\n<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\t<a href=\"https:\/\/kb.hostatom.com\/lesson\/category\/html\/\" title=\"HTML\">HTML<\/a>\n<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\tHTML Responsive Web Design\n<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/kb.hostatom.com\/lesson\/"},{"label":"HTML","link":"https:\/\/kb.hostatom.com\/lesson\/category\/html\/"},{"label":"HTML\u00a0Responsive Web Design","link":"https:\/\/kb.hostatom.com\/lesson\/24160\/"}],"_links":{"self":[{"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/posts\/24160","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/comments?post=24160"}],"version-history":[{"count":0,"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/posts\/24160\/revisions"}],"wp:attachment":[{"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/media?parent=24160"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/categories?post=24160"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kb.hostatom.com\/lesson\/wp-json\/wp\/v2\/tags?post=24160"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}