{"id":1487,"date":"2015-10-08T17:49:22","date_gmt":"2015-10-08T10:49:22","guid":{"rendered":"http:\/\/blog.makewebeasy.com\/?p=1487"},"modified":"2019-12-25T09:57:22","modified_gmt":"2019-12-25T02:57:22","slug":"responsive-web-design-2","status":"publish","type":"post","link":"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/","title":{"rendered":"6 \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19 \u0e01\u0e32\u0e23\u0e17\u0e33 Responsive Web Design"},"content":{"rendered":"<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e04\u0e32\u0e14\u0e27\u0e48\u0e32\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e04\u0e19 \u0e04\u0e07\u0e40\u0e04\u0e22\u0e2d\u0e48\u0e32\u0e19\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a Responsive Web Design \u0e02\u0e2d\u0e07 MakeWebEasy\u00a0\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07\u0e41\u0e25\u0e49\u0e27\u0e43\u0e0a\u0e48\u0e21\u0e31\u0e49\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e15\u0e48\u0e16\u0e49\u0e32\u0e22\u0e31\u0e07\u0e23\u0e39\u0e49\u0e2a\u0e36\u0e01\u0e27\u0e48\u0e32\u0e22\u0e32\u0e01\u0e2d\u0e22\u0e39\u0e48 \u0e2b\u0e23\u0e37\u0e2d\u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e23\u0e39\u0e49\u0e27\u0e48\u0e32\u0e08\u0e30\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07 \u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e19\u0e35\u0e49 \u0e1c\u0e21\u0e08\u0e30\u0e2a\u0e23\u0e38\u0e1b\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e2a\u0e33\u0e04\u0e31\u0e0d\u0e46 \u0e21\u0e32\u0e43\u0e2b\u0e49\u0e2d\u0e48\u0e32\u0e19\u0e07\u0e48\u0e32\u0e22\u0e46 \u0e04\u0e23\u0e31\u0e1a \u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e14\u0e49\u0e27\u0e48\u0e32 \u0e16\u0e49\u0e32\u0e2d\u0e48\u0e32\u0e19\u0e43\u0e2b\u0e49\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08 \u0e41\u0e25\u0e49\u0e27\u0e25\u0e07\u0e21\u0e37\u0e2d\u0e17\u0e33\u0e15\u0e32\u0e21\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e15\u0e48\u0e2d\u0e44\u0e1b\u0e19\u0e35\u0e49 \u0e23\u0e31\u0e1a\u0e23\u0e2d\u0e07\u0e27\u0e48\u0e32\u0e17\u0e33\u0e44\u0e14\u0e49\u0e41\u0e19\u0e48\u0e19\u0e2d\u0e19\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_47_1 counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\">\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2d\u0e48\u0e32\u0e19 \u0e2b\u0e31\u0e27\u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48\u0e2a\u0e19\u0e43\u0e08<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"ez-toc-toggle-icon-1\"><label for=\"item-69fac16f45c88\" aria-label=\"Table of Content\"><span style=\"display: flex;align-items: center;width: 35px;height: 30px;justify-content: center;direction:ltr;\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/label><input  type=\"checkbox\" id=\"item-69fac16f45c88\"><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#%E0%B8%97%E0%B8%B3%E0%B9%84%E0%B8%A1%E0%B8%95%E0%B9%89%E0%B8%AD%E0%B8%87_Responsive_Web_Design\" title=\"\u0e17\u0e33\u0e44\u0e21\u0e15\u0e49\u0e2d\u0e07 Responsive Web Design?\">\u0e17\u0e33\u0e44\u0e21\u0e15\u0e49\u0e2d\u0e07 Responsive Web Design?<\/a><ul class='ez-toc-list-level-3'><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#1_%E0%B8%AD%E0%B8%AD%E0%B8%81%E0%B9%81%E0%B8%9A%E0%B8%9A%E0%B9%83%E0%B8%AB%E0%B9%89%E0%B9%80%E0%B8%A3%E0%B8%B5%E0%B8%A2%E0%B8%9A%E0%B8%87%E0%B9%88%E0%B8%B2%E0%B8%A2\" title=\"1. \u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22\">1. \u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#2_%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%97%E0%B8%B5%E0%B9%88%E0%B8%AB%E0%B8%99%E0%B9%89%E0%B8%B2%E0%B8%88%E0%B8%AD%E0%B9%80%E0%B8%A5%E0%B9%87%E0%B8%81%E0%B8%AA%E0%B8%B8%E0%B8%94%E0%B8%81%E0%B9%88%E0%B8%AD%E0%B8%99%E0%B9%80%E0%B8%AA%E0%B8%A1%E0%B8%AD\" title=\"2. \u0e40\u0e23\u0e34\u0e48\u0e21\u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19\u0e40\u0e2a\u0e21\u0e2d\">2. \u0e40\u0e23\u0e34\u0e48\u0e21\u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19\u0e40\u0e2a\u0e21\u0e2d<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#3_%E0%B8%81%E0%B8%B3%E0%B8%AB%E0%B8%99%E0%B8%94%E0%B8%82%E0%B8%99%E0%B8%B2%E0%B8%94%E0%B9%81%E0%B8%9A%E0%B8%9A_Relative\" title=\"3. \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e41\u0e1a\u0e1a Relative\">3. \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e41\u0e1a\u0e1a Relative<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#4_%E0%B8%AB%E0%B8%B2_Breakpoints_%E0%B9%81%E0%B8%A5%E0%B9%89%E0%B8%A7%E0%B9%80%E0%B8%82%E0%B8%B5%E0%B8%A2%E0%B8%99_Media_Queries\" title=\"4. \u0e2b\u0e32 Breakpoints \u0e41\u0e25\u0e49\u0e27\u0e40\u0e02\u0e35\u0e22\u0e19 Media Queries\">4. \u0e2b\u0e32 Breakpoints \u0e41\u0e25\u0e49\u0e27\u0e40\u0e02\u0e35\u0e22\u0e19 Media Queries<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#5_%E0%B8%81%E0%B8%B3%E0%B8%AB%E0%B8%99%E0%B8%94_Viewport_Meta_Tag\" title=\"5. \u0e01\u0e33\u0e2b\u0e19\u0e14 Viewport Meta Tag\">5. \u0e01\u0e33\u0e2b\u0e19\u0e14 Viewport Meta Tag<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#6_%E0%B9%80%E0%B8%8A%E0%B9%87%E0%B8%84%E0%B8%81%E0%B8%B1%E0%B8%9A_Devices_%E0%B8%88%E0%B8%A3%E0%B8%B4%E0%B8%87%E0%B9%86\" title=\"6. \u0e40\u0e0a\u0e47\u0e04\u0e01\u0e31\u0e1a Devices \u0e08\u0e23\u0e34\u0e07\u0e46\">6. \u0e40\u0e0a\u0e47\u0e04\u0e01\u0e31\u0e1a Devices \u0e08\u0e23\u0e34\u0e07\u0e46<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.makewebeasy.com\/th\/blog\/responsive-web-design-2\/#%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%88%E0%B8%B2%E0%B8%81_0_%E0%B9%84%E0%B8%9B_100_%E0%B9%80%E0%B8%AA%E0%B8%A1%E0%B8%AD\" title=\"\u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01 0 \u0e44\u0e1b 100 \u0e40\u0e2a\u0e21\u0e2d\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01 0 \u0e44\u0e1b 100 \u0e40\u0e2a\u0e21\u0e2d<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%E0%B8%97%E0%B8%B3%E0%B9%84%E0%B8%A1%E0%B8%95%E0%B9%89%E0%B8%AD%E0%B8%87_Responsive_Web_Design\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 18pt;\">\u0e17\u0e33\u0e44\u0e21\u0e15\u0e49\u0e2d\u0e07 Responsive Web Design?<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e01\u0e48\u0e2d\u0e19\u0e08\u0e30\u0e40\u0e23\u0e34\u0e48\u0e21 \u0e40\u0e04\u0e22\u0e21\u0e31\u0e49\u0e22\u0e04\u0e23\u0e31\u0e1a? \u0e17\u0e35\u0e48\u0e40\u0e27\u0e25\u0e32\u0e40\u0e02\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e19\u0e36\u0e07\u0e43\u0e19 PC \u0e41\u0e25\u0e49\u0e27\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e2a\u0e27\u0e22\u0e07\u0e32\u0e21 \u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e07\u0e48\u0e32\u0e22 \u0e41\u0e15\u0e48\u0e1e\u0e2d\u0e44\u0e1b\u0e40\u0e1b\u0e34\u0e14\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e19\u0e31\u0e49\u0e19 \u0e1a\u0e19\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d\u0e01\u0e25\u0e31\u0e1a\u0e1e\u0e1a\u0e27\u0e48\u0e32\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e04\u0e48\u0e2d\u0e19\u0e02\u0e49\u0e32\u0e07\u0e25\u0e33\u0e1a\u0e32\u0e01 \u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2b\u0e19\u0e31\u0e07\u0e2a\u0e37\u0e2d\u0e23\u0e27\u0e21\u0e44\u0e1b\u0e16\u0e36\u0e07\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e25\u0e47\u0e01\u0e25\u0e07 \u0e1b\u0e38\u0e48\u0e21\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e01\u0e47\u0e40\u0e25\u0e47\u0e01\u0e08\u0e19\u0e01\u0e14\u0e22\u0e32\u0e01 \u0e41\u0e16\u0e21\u0e22\u0e31\u0e07\u0e21\u0e35\u0e42\u0e06\u0e29\u0e13\u0e32 \u0e2b\u0e23\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e23\u0e01\u0e2b\u0e39\u0e23\u0e01\u0e15\u0e32\u0e40\u0e22\u0e2d\u0e30\u0e41\u0e22\u0e30\u0e40\u0e15\u0e47\u0e21\u0e44\u0e1b\u0e2b\u0e21\u0e14<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e41\u0e15\u0e48\u0e01\u0e48\u0e2d\u0e19 \u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e41\u0e01\u0e49\u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e02\u0e36\u0e49\u0e19\u0e21\u0e32\u0e2d\u0e35\u0e01\u0e40\u0e27\u0e2d\u0e23\u0e4c\u0e0a\u0e31\u0e48\u0e19\u0e19\u0e36\u0e07\u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e43\u0e19\u0e40\u0e27\u0e2d\u0e23\u0e4c\u0e0a\u0e31\u0e48\u0e19\u0e19\u0e35\u0e49 \u0e08\u0e30\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e02\u0e36\u0e49\u0e19\u0e1a\u0e19\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c\u0e17\u0e35\u0e48\u0e21\u0e35\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e02\u0e19\u0e32\u0e14\u0e40\u0e25\u0e47\u0e01 \u0e23\u0e27\u0e21\u0e44\u0e1b\u0e16\u0e36\u0e07\u0e15\u0e31\u0e14\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e2d\u0e01 \u0e40\u0e2b\u0e25\u0e37\u0e2d\u0e44\u0e27\u0e49\u0e41\u0e15\u0e48\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e35\u0e48 User \u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e08\u0e23\u0e34\u0e07\u0e46 \u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19 \u0e41\u0e15\u0e48\u0e27\u0e34\u0e18\u0e35\u0e19\u0e35\u0e49\u0e21\u0e35\u0e02\u0e49\u0e2d\u0e40\u0e2a\u0e35\u0e22\u0e04\u0e37\u0e2d \u0e21\u0e35\u0e04\u0e48\u0e32\u0e43\u0e0a\u0e49\u0e08\u0e48\u0e32\u0e22\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e36\u0e49\u0e19 \u0e41\u0e25\u0e30\u0e22\u0e31\u0e07\u0e15\u0e49\u0e2d\u0e07\u0e43\u0e0a\u0e49\u0e40\u0e27\u0e25\u0e32\u0e43\u0e19\u0e01\u0e32\u0e23\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e35\u0e01\u0e14\u0e49\u0e27\u0e22<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">Responsive Web Design \u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e35\u0e01\u0e17\u0e32\u0e07\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e19\u0e36\u0e07 \u0e43\u0e19\u0e01\u0e32\u0e23\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e17\u0e35\u0e48\u0e01\u0e33\u0e25\u0e31\u0e07\u0e44\u0e14\u0e49\u0e23\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e19\u0e34\u0e22\u0e21\u0e43\u0e19\u0e02\u0e13\u0e30\u0e19\u0e35\u0e49\u0e04\u0e23\u0e31\u0e1a \u0e42\u0e14\u0e22\u0e21\u0e35\u0e08\u0e38\u0e14\u0e1b\u0e23\u0e30\u0e2a\u0e07\u0e04\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d \u201c\u0e17\u0e33\u0e43\u0e2b\u0e49 User \u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u201d \u0e42\u0e14\u0e22 Responsive Web Design \u0e19\u0e31\u0e49\u0e19 \u0e21\u0e35\u0e02\u0e49\u0e2d\u0e14\u0e35\u0e04\u0e37\u0e2d\u0e08\u0e30\u0e43\u0e0a\u0e49 source code \u0e15\u0e31\u0e27\u0e40\u0e14\u0e35\u0e22\u0e27 \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e1b\u0e23\u0e30\u0e2b\u0e22\u0e31\u0e14\u0e40\u0e27\u0e25\u0e32\u0e41\u0e25\u0e30\u0e04\u0e48\u0e32\u0e43\u0e0a\u0e49\u0e08\u0e48\u0e32\u0e22 \u0e41\u0e15\u0e48\u0e08\u0e30\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25 \u0e43\u0e2b\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e01\u0e31\u0e1a\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e44\u0e14\u0e49\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e21\u0e48\u0e19\u0e48\u0e32\u0e40\u0e0a\u0e37\u0e48\u0e2d<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e04\u0e33\u0e16\u0e32\u0e21\u0e04\u0e37\u0e2d \u0e17\u0e33\u0e44\u0e21 Responsive Web Design \u0e16\u0e36\u0e07\u0e17\u0e33\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e19\u0e31\u0e49\u0e19\u0e44\u0e14\u0e49? <\/span><\/p>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e15\u0e2d\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e46 \u0e27\u0e48\u0e32 Responsive Web Design \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e19\u0e33\u0e40\u0e17\u0e04\u0e19\u0e34\u0e04\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e2d\u0e22\u0e48\u0e32\u0e07 \u0e21\u0e32\u0e43\u0e0a\u0e49\u0e23\u0e48\u0e27\u0e21\u0e01\u0e31\u0e19 \u0e0b\u0e36\u0e48\u0e07\u0e40\u0e17\u0e04\u0e19\u0e34\u0e04\u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e35\u0e49 \u0e16\u0e49\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e14\u0e35\u0e48\u0e22\u0e27\u0e46 \u0e21\u0e31\u0e19\u0e01\u0e47\u0e2d\u0e32\u0e08\u0e08\u0e30\u0e17\u0e33\u0e2d\u0e30\u0e44\u0e23\u0e44\u0e14\u0e49\u0e44\u0e21\u0e48\u0e21\u0e32\u0e01 \u0e41\u0e15\u0e48\u0e1e\u0e2d\u0e21\u0e31\u0e19\u0e21\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e31\u0e19\u0e1e\u0e23\u0e49\u0e2d\u0e21\u0e2b\u0e19\u0e49\u0e32\u0e41\u0e25\u0e49\u0e27 \u0e01\u0e25\u0e31\u0e1a\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2a\u0e34\u0e48\u0e07\u0e43\u0e2b\u0e21\u0e48\u0e17\u0e35\u0e48\u0e40\u0e23\u0e35\u0e22\u0e01\u0e27\u0e48\u0e32 Responsive Web Design \u0e02\u0e36\u0e49\u0e19\u0e21\u0e32\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e2d\u0e32\u0e25\u0e48\u0e30\u0e04\u0e23\u0e31\u0e1a \u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e17\u0e38\u0e01\u0e04\u0e19\u0e04\u0e07\u0e23\u0e39\u0e49\u0e08\u0e31\u0e01 Responsive Web Design \u0e21\u0e32\u0e01\u0e02\u0e36\u0e49\u0e19\u0e41\u0e25\u0e49\u0e27 \u0e17\u0e35\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e21\u0e32\u0e40\u0e02\u0e49\u0e32\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e01\u0e31\u0e19\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e1c\u0e21\u0e08\u0e30\u0e2a\u0e23\u0e38\u0e1b\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e01\u0e32\u0e23\u0e17\u0e33 Responsive Web Design \u0e21\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e02\u0e49\u0e2d\u0e46 \u0e25\u0e2d\u0e07\u0e04\u0e48\u0e2d\u0e22\u0e46 \u0e17\u0e33\u0e04\u0e27\u0e32\u0e21\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e41\u0e25\u0e49\u0e27\u0e17\u0e33\u0e15\u0e32\u0e21\u0e14\u0e39\u0e19\u0e30\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"1_%E0%B8%AD%E0%B8%AD%E0%B8%81%E0%B9%81%E0%B8%9A%E0%B8%9A%E0%B9%83%E0%B8%AB%E0%B9%89%E0%B9%80%E0%B8%A3%E0%B8%B5%E0%B8%A2%E0%B8%9A%E0%B8%87%E0%B9%88%E0%B8%B2%E0%B8%A2\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 18pt;\">1. \u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e2b\u0e32\u0e01\u0e04\u0e34\u0e14\u0e08\u0e30\u0e17\u0e33 Responsive Web Design \u0e2a\u0e34\u0e48\u0e07\u0e41\u0e23\u0e01\u0e17\u0e35\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e04\u0e33\u0e19\u0e36\u0e07\u0e16\u0e36\u0e07\u0e04\u0e37\u0e2d \u0e01\u0e32\u0e23\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e04\u0e23\u0e31\u0e1a \u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e15\u0e31\u0e14\u0e44\u0e14\u0e49 \u0e2b\u0e23\u0e37\u0e2d\u0e44\u0e21\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19 \u0e2d\u0e22\u0e48\u0e32\u0e43\u0e2a\u0e48\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b \u0e40\u0e0a\u0e48\u0e19 Flash \u0e2b\u0e23\u0e37\u0e2d Effects \u0e15\u0e48\u0e32\u0e07\u0e46 (\u0e40\u0e0a\u0e48\u0e19 Parallax \u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19) \u0e23\u0e27\u0e21\u0e44\u0e1b\u0e16\u0e36\u0e07\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19 html \u0e43\u0e2b\u0e49 clean \u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e40\u0e09\u0e1e\u0e32\u0e30 html elements \u0e17\u0e35\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19 \u0e2a\u0e48\u0e27\u0e19 style sheets \u0e01\u0e47\u0e43\u0e2b\u0e49\u0e25\u0e30\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e41\u0e1a\u0e1a inline \u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e17\u0e33\u0e04\u0e27\u0e32\u0e21\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e01\u0e31\u0e1a\u0e17\u0e32\u0e07 Business \u0e2b\u0e23\u0e37\u0e2d\u0e17\u0e32\u0e07\u0e1c\u0e39\u0e49\u0e1a\u0e23\u0e34\u0e2b\u0e32\u0e23\u0e14\u0e49\u0e27\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e04\u0e19 \u0e23\u0e39\u0e49\u0e41\u0e04\u0e48\u0e27\u0e48\u0e32 Responsive Web Design \u0e08\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e14\u0e39\u0e14\u0e35\u0e43\u0e19 Devices \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e41\u0e15\u0e48\u0e44\u0e21\u0e48\u0e23\u0e39\u0e49\u0e02\u0e49\u0e2d\u0e08\u0e33\u0e01\u0e31\u0e14\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19 \u0e08\u0e36\u0e07\u0e04\u0e32\u0e14\u0e2b\u0e27\u0e31\u0e07\u0e27\u0e48\u0e32\u0e21\u0e31\u0e19\u0e08\u0e30\u0e15\u0e49\u0e2d\u0e07\u0e17\u0e33\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e19\u0e31\u0e49\u0e19\u0e44\u0e14\u0e49\u0e19\u0e30 \u0e2d\u0e22\u0e48\u0e32\u0e07\u0e19\u0e35\u0e49\u0e44\u0e14\u0e49\u0e19\u0e30 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e15\u0e01\u0e25\u0e07\u0e01\u0e31\u0e1a\u0e1e\u0e27\u0e01\u0e40\u0e04\u0e49\u0e32\u0e01\u0e48\u0e2d\u0e19\u0e04\u0e23\u0e31\u0e1a \u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e43\u0e2b\u0e49\u0e40\u0e04\u0e49\u0e32\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08 \u0e1a\u0e2d\u0e01\u0e40\u0e04\u0e49\u0e32\u0e27\u0e48\u0e32\u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e17\u0e33\u0e44\u0e14\u0e49\u0e19\u0e30 \u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e17\u0e33\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e19\u0e30 \u0e15\u0e34\u0e14\u0e2d\u0e30\u0e44\u0e23\u0e15\u0e23\u0e07\u0e44\u0e2b\u0e19\u0e01\u0e47\u0e27\u0e48\u0e32\u0e44\u0e1b\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e15\u0e01\u0e25\u0e07\u0e01\u0e31\u0e19\u0e44\u0e14\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e23\u0e49\u0e2d\u0e22\u0e41\u0e25\u0e49\u0e27 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e04\u0e34\u0e14\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e31\u0e49\u0e07\u0e43\u0e08\u0e08\u0e30\u0e43\u0e2a\u0e48\u0e25\u0e07\u0e44\u0e1b\u0e43\u0e19\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32\u0e04\u0e23\u0e31\u0e1a \u0e13 \u0e08\u0e38\u0e14\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e2a\u0e19\u0e43\u0e08\u0e19\u0e30\u0e04\u0e23\u0e31\u0e1a \u0e27\u0e48\u0e32\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49 \u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e41\u0e2a\u0e14\u0e07\u0e1a\u0e19 devices \u0e44\u0e2b\u0e19 \u0e2b\u0e25\u0e31\u0e07\u0e08\u0e32\u0e01\u0e44\u0e14\u0e49\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\u0e41\u0e25\u0e49\u0e27 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e2b\u0e31\u0e27\u0e02\u0e49\u0e2d\u0e02\u0e2d\u0e07\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e25\u0e07\u0e1a\u0e19\u0e01\u0e23\u0e30\u0e14\u0e32\u0e29\u0e42\u0e1e\u0e2a\u0e15\u0e4c-\u0e2d\u0e34\u0e17 \u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<h3 class=\"ctl\" align=\"LEFT\"><span class=\"ez-toc-section\" id=\"2_%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%97%E0%B8%B5%E0%B9%88%E0%B8%AB%E0%B8%99%E0%B9%89%E0%B8%B2%E0%B8%88%E0%B8%AD%E0%B9%80%E0%B8%A5%E0%B9%87%E0%B8%81%E0%B8%AA%E0%B8%B8%E0%B8%94%E0%B8%81%E0%B9%88%E0%B8%AD%E0%B8%99%E0%B9%80%E0%B8%AA%E0%B8%A1%E0%B8%AD\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif;\">2. \u0e40\u0e23\u0e34\u0e48\u0e21\u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19\u0e40\u0e2a\u0e21\u0e2d<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e40\u0e2d\u0e32\u0e25\u0e30\u0e04\u0e23\u0e31\u0e1a \u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e23\u0e39\u0e49\u0e41\u0e25\u0e49\u0e27\u0e27\u0e48\u0e32 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e21\u0e32\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e40\u0e17\u0e48\u0e32\u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33\u0e44\u0e14\u0e49 \u0e41\u0e25\u0e49\u0e27\u0e40\u0e23\u0e32\u0e22\u0e31\u0e07\u0e21\u0e35\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e02\u0e2d\u0e07\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 \u0e17\u0e35\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e08\u0e30\u0e43\u0e2a\u0e48\u0e25\u0e07\u0e44\u0e1b\u0e43\u0e19\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32 \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e15\u0e48\u0e2d\u0e21\u0e32 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e17\u0e35\u0e48\u0e40\u0e25\u0e47\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19\u0e04\u0e23\u0e31\u0e1a<\/span><span style=\"color: #444444;\">(<\/span><a href=\"http:\/\/www.siamhtml.com\/\u0e17\u0e33\u0e44\u0e21-mobile-first-responsive-web-design\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Mobile-First<\/b><\/span><\/a><span style=\"color: #444444;\">) <\/span><span style=\"color: #444444;\">\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e2a\u0e33\u0e04\u0e31\u0e0d\u0e21\u0e32\u0e01\u0e04\u0e23\u0e31\u0e1a \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e16\u0e37\u0e2d\u0e40\u0e1b\u0e47\u0e19\u0e23\u0e32\u0e01\u0e10\u0e32\u0e19\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e40\u0e23\u0e32\u0e40\u0e25\u0e22 \u0e04\u0e27\u0e32\u0e21\u0e22\u0e32\u0e01\u0e02\u0e2d\u0e07\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e15\u0e23\u0e07\u0e17\u0e35\u0e48 \u0e04\u0e19\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b\u0e21\u0e31\u0e01\u0e08\u0e30\u0e15\u0e34\u0e14\u0e20\u0e32\u0e1e\u0e02\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a <\/span><span style=\"color: #444444;\">PC <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e1c\u0e21\u0e44\u0e21\u0e48\u0e41\u0e19\u0e30\u0e19\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e34\u0e48\u0e21\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a <\/span><span style=\"color: #444444;\">PC <\/span><span style=\"color: #444444;\">\u0e01\u0e48\u0e2d\u0e19\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e08\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e42\u0e04\u0e49\u0e14\u0e44\u0e14\u0e49\u0e25\u0e33\u0e1a\u0e32\u0e01\u0e01\u0e27\u0e48\u0e32 \u0e41\u0e25\u0e30\u0e21\u0e35\u0e42\u0e2d\u0e01\u0e32\u0e2a\u0e17\u0e35\u0e48\u0e08\u0e30\u0e40\u0e01\u0e34\u0e14\u0e01\u0e32\u0e23\u0e0b\u0e49\u0e33\u0e0b\u0e49\u0e2d\u0e19\u0e02\u0e2d\u0e07\u0e42\u0e04\u0e49\u0e14\u0e21\u0e32\u0e01\u0e01\u0e27\u0e48\u0e32\u0e14\u0e49\u0e27\u0e22\u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e17\u0e04\u0e19\u0e34\u0e04\u0e07\u0e48\u0e32\u0e22\u0e46 \u0e02\u0e2d\u0e07\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e04\u0e37\u0e2d \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e25\u0e37\u0e21 PC \u0e44\u0e1b\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e2a\u0e19\u0e43\u0e08\u0e21\u0e31\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e2b\u0e31\u0e19\u0e21\u0e32\u0e42\u0e1f\u0e01\u0e31\u0e2a\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e46 \u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13 300px \u0e25\u0e2d\u0e07\u0e19\u0e36\u0e01\u0e14\u0e39\u0e04\u0e23\u0e31\u0e1a \u0e27\u0e48\u0e32\u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e02\u0e19\u0e32\u0e14\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e04\u0e27\u0e23\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a User Interface \u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e17\u0e35\u0e48\u0e08\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49 User \u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e07\u0e48\u0e32\u0e22\u0e21\u0e32\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14 \u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e08\u0e23\u0e34\u0e07\u0e46 \u0e2d\u0e22\u0e48\u0e32\u0e43\u0e2a\u0e48\u0e04\u0e23\u0e31\u0e1a \u0e40\u0e0a\u0e48\u0e19 \u0e42\u0e06\u0e29\u0e13\u0e32 \u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19 \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e04\u0e48\u0e2d\u0e19\u0e02\u0e49\u0e32\u0e07\u0e22\u0e32\u0e01 \u0e41\u0e25\u0e30\u0e17\u0e49\u0e32\u0e17\u0e32\u0e22\u0e21\u0e32\u0e01\u0e04\u0e23\u0e31\u0e1a \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e1e\u0e34\u0e16\u0e35\u0e1e\u0e34\u0e16\u0e31\u0e19\u0e43\u0e2b\u0e49\u0e21\u0e32\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14<\/span><\/p>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e1c\u0e21\u0e41\u0e19\u0e30\u0e19\u0e33\u0e15\u0e31\u0e27\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e19\u0e01\u0e32\u0e23\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e46 \u0e04\u0e23\u0e31\u0e1a \u0e04\u0e37\u0e2d\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e27\u0e32\u0e14\u0e01\u0e23\u0e2d\u0e1a\u0e2a\u0e35\u0e48\u0e40\u0e2b\u0e25\u0e35\u0e48\u0e22\u0e21\u0e1c\u0e37\u0e19\u0e1c\u0e49\u0e32\u0e02\u0e36\u0e49\u0e19\u0e21\u0e32\u0e2d\u0e31\u0e19\u0e19\u0e36\u0e07 \u0e25\u0e07\u0e1a\u0e19\u0e01\u0e23\u0e30\u0e14\u0e32\u0e29 \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07 <\/span><span style=\"color: #444444;\">iPhone4(5\u00d77.5 cm) <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e17\u0e35\u0e19\u0e35\u0e49\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e25\u0e2d\u0e07\u0e19\u0e33\u0e01\u0e23\u0e30\u0e14\u0e32\u0e29\u0e42\u0e1e\u0e2a\u0e15\u0e4c<\/span><span style=\"color: #444444;\">&#8211;<\/span><span style=\"color: #444444;\">\u0e2d\u0e34\u0e17 \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e40\u0e02\u0e35\u0e22\u0e19\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e40\u0e15\u0e23\u0e35\u0e22\u0e21\u0e44\u0e27\u0e49 \u0e21\u0e32\u0e25\u0e2d\u0e07\u0e08\u0e31\u0e14\u0e27\u0e32\u0e07\u0e25\u0e07\u0e1a\u0e19\u0e01\u0e23\u0e2d\u0e1a\u0e19\u0e31\u0e49\u0e19\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e25\u0e49\u0e27\u0e25\u0e2d\u0e07\u0e2a\u0e21\u0e21\u0e15\u0e34\u0e15\u0e31\u0e27\u0e40\u0e23\u0e32\u0e40\u0e2d\u0e07\u0e40\u0e1b\u0e47\u0e19\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e40\u0e04\u0e22\u0e40\u0e02\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e19\u0e35\u0e49\u0e21\u0e32\u0e01\u0e48\u0e2d\u0e19 \u0e01\u0e32\u0e23\u0e27\u0e32\u0e07\u0e15\u0e33\u0e41\u0e2b\u0e19\u0e48\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e08\u0e30\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e21\u0e31\u0e49\u0e22 \u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e21\u0e31\u0e49\u0e22 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e1b\u0e23\u0e31\u0e1a\u0e08\u0e19\u0e01\u0e27\u0e48\u0e32\u0e08\u0e30\u0e1e\u0e2d\u0e43\u0e08\u0e04\u0e23\u0e31\u0e1a \u0e23\u0e32\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e1c\u0e21\u0e44\u0e14\u0e49\u0e40\u0e02\u0e35\u0e22\u0e19\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e44\u0e27\u0e49\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e41\u0e25\u0e49\u0e27\u0e43\u0e19\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21 \u201c<\/span><a href=\"http:\/\/www.siamhtml.com\/\u0e2a\u0e2d\u0e19-\u0e27\u0e34\u0e18\u0e35-\u0e40\u0e02\u0e35\u0e22\u0e19-wireframe\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e21\u0e32\u0e2b\u0e31\u0e14\u0e43\u0e0a\u0e49 <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/\u0e2a\u0e2d\u0e19-\u0e27\u0e34\u0e18\u0e35-\u0e40\u0e02\u0e35\u0e22\u0e19-wireframe\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Wireframe <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/\u0e2a\u0e2d\u0e19-\u0e27\u0e34\u0e18\u0e35-\u0e40\u0e02\u0e35\u0e22\u0e19-wireframe\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e01\u0e31\u0e19\u0e40\u0e16\u0e2d\u0e30<\/b><\/span><\/a><span style=\"color: #444444;\">\u201d \u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e23\u0e48\u0e32\u0e07\u0e20\u0e32\u0e1e\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e1a\u0e19\u0e08\u0e2d\u0e40\u0e25\u0e47\u0e01\u0e46 \u0e21\u0e32\u0e41\u0e25\u0e49\u0e27 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e25\u0e07\u0e21\u0e37\u0e2d\u0e40\u0e02\u0e35\u0e22\u0e19 html \u0e04\u0e23\u0e31\u0e1a \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e2b\u0e31\u0e19\u0e44\u0e1b\u0e21\u0e2d\u0e07\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e23\u0e48\u0e32\u0e07\u0e44\u0e27\u0e49\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e15\u0e48\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e19\u0e36\u0e01\u0e27\u0e48\u0e32\u0e21\u0e31\u0e19\u0e21\u0e35\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e2d\u0e30\u0e44\u0e23\u0e1a\u0e49\u0e32\u0e07 \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e08\u0e30\u0e43\u0e2a\u0e48\u0e44\u0e27\u0e49\u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e25\u0e07\u0e44\u0e1b\u0e14\u0e49\u0e27\u0e22 html \u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e44\u0e14\u0e49 <\/span><span style=\"color: #444444;\">html <\/span><span style=\"color: #444444;\">\u0e41\u0e25\u0e49\u0e27 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e25\u0e2d\u0e07\u0e1e\u0e23\u0e35\u0e27\u0e34\u0e27\u0e14\u0e39\u0e04\u0e23\u0e31\u0e1a \u0e40\u0e23\u0e32\u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19 <\/span><span style=\"color: #444444;\">content <\/span><span style=\"color: #444444;\">\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e44\u0e27\u0e49 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e14\u0e39\u0e04\u0e23\u0e31\u0e1a\u0e27\u0e48\u0e32\u0e25\u0e33\u0e14\u0e31\u0e1a \u0e41\u0e25\u0e30\u0e01\u0e32\u0e23\u0e43\u0e2b\u0e49\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e33\u0e04\u0e31\u0e0d \u0e21\u0e31\u0e19\u0e2a\u0e21\u0e40\u0e2b\u0e15\u0e38\u0e2a\u0e21\u0e1c\u0e25\u0e21\u0e31\u0e49\u0e22 \u0e16\u0e49\u0e32\u0e22\u0e31\u0e07 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e1b\u0e23\u0e31\u0e1a\u0e01\u0e48\u0e2d\u0e19\u0e04\u0e23\u0e31\u0e1a \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e2d\u0e22\u0e48\u0e32\u0e25\u0e37\u0e21\u0e04\u0e33\u0e19\u0e36\u0e07\u0e16\u0e36\u0e07\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u00a0<\/span><a href=\"http:\/\/www.siamhtml.com\/sectioning-content-html5-\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Sectioning content<\/b><\/span><\/a><span style=\"color: #444444;\">\u00a0<\/span><span style=\"color: #444444;\">\u0e41\u0e25\u0e30\u00a0<\/span><a href=\"http:\/\/www.siamhtml.com\/\u0e2a\u0e2d\u0e19\u0e27\u0e34\u0e18\u0e35\u0e43\u0e0a\u0e49-header-hgroup-h1-h6-html5\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Document Outlines<\/b><\/span><\/a><span style=\"color: #444444;\">\u00a0<\/span><span style=\"color: #444444;\">\u0e14\u0e49\u0e27\u0e22\u0e19\u0e30\u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/pure_html.png\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/pure_html.png\" alt=\"pure html with no style sheets\" width=\"320\" height=\"478\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e011\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19 html \u0e42\u0e14\u0e22\u0e14\u0e39\u0e08\u0e32\u0e01\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e40\u0e15\u0e23\u0e35\u0e22\u0e21\u0e44\u0e27\u0e49\u0e21\u0e35\u0e2d\u0e30\u0e44\u0e23\u0e1a\u0e49\u0e32\u0e07 \u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e04\u0e33\u0e19\u0e36\u0e07\u0e16\u0e36\u0e07\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"3_%E0%B8%81%E0%B8%B3%E0%B8%AB%E0%B8%99%E0%B8%94%E0%B8%82%E0%B8%99%E0%B8%B2%E0%B8%94%E0%B9%81%E0%B8%9A%E0%B8%9A_Relative\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 14pt;\">3. \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e41\u0e1a\u0e1a Relative<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e21\u0e37\u0e48\u0e2d html \u0e42\u0e2d\u0e40\u0e04\u0e41\u0e25\u0e49\u0e27 \u0e15\u0e48\u0e2d\u0e21\u0e32\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19 style sheets \u0e43\u0e2b\u0e49\u0e01\u0e31\u0e1a html \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e44\u0e27\u0e49\u0e04\u0e23\u0e31\u0e1a \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e14\u0e39\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e23\u0e48\u0e32\u0e07\u0e44\u0e27\u0e49\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e25\u0e49\u0e27\u0e40\u0e02\u0e35\u0e22\u0e19 style sheets \u0e08\u0e19\u0e1e\u0e23\u0e35\u0e27\u0e34\u0e27\u0e41\u0e25\u0e49\u0e27\u0e21\u0e35\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e1a\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e23\u0e48\u0e32\u0e07\u0e44\u0e27\u0e49\u0e04\u0e23\u0e31\u0e1a \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e04\u0e33\u0e19\u0e36\u0e07\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e19\u0e36\u0e07 \u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2a\u0e34\u0e48\u0e07\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a relative \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e2a\u0e31\u0e21\u0e1e\u0e31\u0e19\u0e18\u0e4c\u0e01\u0e31\u0e1a\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e2d\u0e22\u0e39\u0e48\u0e02\u0e49\u0e32\u0e07\u0e40\u0e04\u0e35\u0e22\u0e07\u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e2a\u0e34\u0e48\u0e07\u0e41\u0e23\u0e01\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a relative \u0e01\u0e47\u0e04\u0e37\u0e2d layout \u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a \u0e2b\u0e23\u0e37\u0e2d\u0e17\u0e35\u0e48\u0e40\u0e23\u0e35\u0e22\u0e01\u0e01\u0e31\u0e19\u0e27\u0e48\u0e32 Fluid Layouts \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14 layout \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e43\u0e2b\u0e49\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e40\u0e1b\u0e47\u0e19 % \u0e04\u0e37\u0e2d\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27\u0e40\u0e1b\u0e47\u0e19 pixel \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e41\u0e15\u0e48\u0e01\u0e48\u0e2d\u0e19<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e04\u0e19 \u0e04\u0e07\u0e40\u0e04\u0e22\u0e40\u0e08\u0e2d\u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a box model \u0e43\u0e0a\u0e48\u0e21\u0e31\u0e49\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e2a\u0e21\u0e21\u0e15\u0e34\u0e40\u0e27\u0e47\u0e1a\u0e40\u0e23\u0e32\u0e21\u0e35 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e44\u0e27\u0e49 60% \u0e41\u0e25\u0e30 40% \u0e15\u0e32\u0e21\u0e25\u0e33\u0e14\u0e31\u0e1a \u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14 margin \u0e2b\u0e23\u0e37\u0e2d padding \u0e40\u0e2d\u0e32\u0e44\u0e27\u0e49\u0e14\u0e49\u0e27\u0e22 \u0e1c\u0e25\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e04\u0e37\u0e2d \u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c \u0e08\u0e30\u0e23\u0e27\u0e21\u0e01\u0e31\u0e19\u0e40\u0e01\u0e34\u0e19 100% \u0e04\u0e23\u0e31\u0e1a \u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e19\u0e35\u0e49\u0e41\u0e01\u0e49\u0e42\u0e14\u0e22\u0e43\u0e2a\u0e48 CSS Rule \u0e15\u0e32\u0e21\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07\u0e19\u0e35\u0e49\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<table border=\"0\" width=\"100%\" cellspacing=\"0\" cellpadding=\"2\">\n<colgroup>\n<col width=\"2*\" \/>\n<col width=\"254*\" \/> <\/colgroup>\n<tbody>\n<tr>\n<td bgcolor=\"#222222\" width=\"1%\"><\/td>\n<td width=\"99%\">\n<div id=\"crayon-560d586d92af5788294156-1\" dir=\"LTR\"><span style=\"font-family: georgia, palatino, serif;\"><span style=\"color: #75d1f2;\">*<\/span><span style=\"color: #c9d2d1;\">{<\/span><\/span><\/div>\n<div id=\"crayon-560d586d92af5788294156-2\" dir=\"LTR\"><span style=\"font-family: georgia, palatino, serif;\"><span style=\"color: #006fe0;\">\u00a0\u00a0\u00a0\u00a0<\/span><span style=\"color: #ffa9a9;\">-webkit-box-sizing<\/span>:border-box;<\/span><\/div>\n<div id=\"crayon-560d586d92af5788294156-3\" dir=\"LTR\"><span style=\"font-family: georgia, palatino, serif;\"><span style=\"color: #006fe0;\">\u00a0\u00a0\u00a0\u00a0<\/span><span style=\"color: #ffa9a9;\">-moz-box-sizing<\/span>:border-box;<\/span><\/div>\n<div id=\"crayon-560d586d92af5788294156-4\" dir=\"LTR\"><span style=\"font-family: georgia, palatino, serif;\"><span style=\"color: #006fe0;\">\u00a0\u00a0\u00a0\u00a0<\/span><span style=\"color: #ffa9a9;\">box-sizing<\/span>:border-box;<\/span><\/div>\n<div id=\"crayon-560d586d92af5788294156-5\" dir=\"LTR\"><span style=\"color: #c9d2d1; font-family: georgia, palatino, serif;\">}<\/span><\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e15\u0e48\u0e2d\u0e21\u0e32\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 image \u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a relative \u0e14\u0e49\u0e27\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e42\u0e14\u0e22\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e40\u0e1b\u0e47\u0e19 % \u0e43\u0e2b\u0e49\u0e2d\u0e34\u0e07\u0e15\u0e32\u0e21 container \u0e02\u0e2d\u0e07 image \u0e19\u0e31\u0e49\u0e19\u0e46 \u0e08\u0e32\u0e01\u0e19\u0e31\u0e49\u0e19\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14 max-width \u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e17\u0e35\u0e48\u0e41\u0e17\u0e49\u0e08\u0e23\u0e34\u0e07\u0e02\u0e2d\u0e07 image \u0e14\u0e49\u0e27\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e20\u0e32\u0e1e\u0e08\u0e30\u0e44\u0e14\u0e49\u0e44\u0e21\u0e48\u0e41\u0e15\u0e01 \u0e40\u0e27\u0e25\u0e32 container \u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48\u0e21\u0e32\u0e01\u0e46<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif;\"><span style=\"font-size: 12pt;\">\u0e2d\u0e35\u0e01\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e19\u0e36\u0e07\u0e17\u0e35\u0e48\u0e04\u0e27\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a relative \u0e01\u0e47\u0e04\u0e37\u0e2d font \u0e04\u0e23\u0e31\u0e1a \u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 font \u0e17\u0e35\u0e48 body \u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19 100% \u0e0b\u0e36\u0e48\u0e07\u0e08\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 font \u0e43\u0e19 element \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19 body \u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 100% \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 \u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 font \u0e43\u0e19 element \u0e44\u0e2b\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e1e\u0e34\u0e40\u0e28\u0e29 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e43\u0e0a\u0e49\u0e2b\u0e19\u0e48\u0e27\u0e22 em \u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22 em \u0e19\u0e35\u0e49\u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07\u0e08\u0e33\u0e19\u0e27\u0e19\u0e40\u0e17\u0e48\u0e32\u0e02\u0e2d\u0e07\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48 inherit \u0e21\u0e32\u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e43\u0e19\u0e17\u0e35\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e40\u0e1b\u0e47\u0e19<\/span> <span style=\"font-size: 12pt;\">100% \u0e08\u0e30\u0e44\u0e14\u0e49\u0e27\u0e48\u0e32 \u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1b\u0e47\u0e19 2 em \u0e01\u0e47\u0e08\u0e30\u0e44\u0e14\u0e49 font \u0e02\u0e19\u0e32\u0e14 200% \u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/relative_size.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/relative_size.png\" alt=\"relative_size\" width=\"554\" height=\"142\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e012\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e43\u0e0a\u0e49\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e41\u0e1a\u0e1a relative \u0e41\u0e17\u0e19\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1b\u0e47\u0e19 pixel<\/span><\/p>\n<h3 class=\"ctl\" align=\"LEFT\"><span class=\"ez-toc-section\" id=\"4_%E0%B8%AB%E0%B8%B2_Breakpoints_%E0%B9%81%E0%B8%A5%E0%B9%89%E0%B8%A7%E0%B9%80%E0%B8%82%E0%B8%B5%E0%B8%A2%E0%B8%99_Media_Queries\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif;\">4. \u0e2b\u0e32 Breakpoints \u0e41\u0e25\u0e49\u0e27\u0e40\u0e02\u0e35\u0e22\u0e19 Media Queries<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e25\u0e2d\u0e07\u0e1e\u0e23\u0e35\u0e27\u0e34\u0e27\u0e14\u0e39 \u0e17\u0e35\u0e48\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e21\u0e32\u0e13 <\/span><span style=\"color: #444444;\">300px <\/span><span style=\"color: #444444;\">\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e2d\u0e22\u0e32\u0e01\u0e40\u0e2b\u0e47\u0e19\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e17\u0e35\u0e48\u0e17\u0e33\u0e43\u0e2b\u0e49 <\/span><span style=\"color: #444444;\">User <\/span><span style=\"color: #444444;\">\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e21\u0e32\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14 \u0e17\u0e35\u0e19\u0e35\u0e49 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e25\u0e2d\u0e07\u0e02\u0e22\u0e32\u0e22 <\/span><span style=\"color: #444444;\">viewport <\/span><span style=\"color: #444444;\">\u0e08\u0e32\u0e01 <\/span><span style=\"color: #444444;\">300px <\/span><span style=\"color: #444444;\">\u0e02\u0e36\u0e49\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e22\u0e46 \u0e04\u0e23\u0e31\u0e1a \u0e14\u0e49\u0e27\u0e22\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2a\u0e34\u0e48\u0e07\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a <\/span><span style=\"color: #444444;\">relative <\/span><span style=\"color: #444444;\">\u0e41\u0e21\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e02\u0e22\u0e32\u0e22 <\/span><span style=\"color: #444444;\">viewport <\/span><span style=\"color: #444444;\">\u0e43\u0e2b\u0e49\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 \u0e2d\u0e07\u0e04\u0e4c\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e08\u0e30\u0e22\u0e31\u0e07\u0e04\u0e07\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e14\u0e35\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e2b\u0e19\u0e36\u0e48\u0e07 \u0e41\u0e15\u0e48\u0e16\u0e49\u0e32\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e40\u0e23\u0e32\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e36\u0e49\u0e19\u0e44\u0e1b\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e22\u0e46 \u0e41\u0e25\u0e49\u0e27\u0e1e\u0e1a\u0e27\u0e48\u0e32\u0e17\u0e35\u0e48\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e19\u0e32\u0e14\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e2d\u0e07\u0e04\u0e4c\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e44\u0e14\u0e49\u0e2a\u0e30\u0e14\u0e27\u0e01\u0e02\u0e36\u0e49\u0e19\u0e44\u0e14\u0e49 \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21 \u0e40\u0e23\u0e32\u0e08\u0e30\u0e40\u0e23\u0e35\u0e22\u0e01\u0e08\u0e38\u0e14\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 <\/span><span style=\"color: #444444;\">Breakpoint <\/span><span style=\"color: #444444;\">\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e43\u0e0a\u0e49 <\/span><span style=\"color: #444444;\">Media Queries <\/span><span style=\"color: #444444;\">\u0e43\u0e19\u0e01\u0e32\u0e23\u0e43\u0e2a\u0e48 <\/span><span style=\"color: #444444;\">style sheets <\/span><span style=\"color: #444444;\">\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a <\/span><span style=\"color: #444444;\">Breakpoint <\/span><span style=\"color: #444444;\">\u0e19\u0e31\u0e49\u0e19\u0e46 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e17\u0e35\u0e48\u0e08\u0e30\u0e1b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e43\u0e2b\u0e49\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e15\u0e23\u0e07\u0e15\u0e32\u0e21\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e04\u0e23\u0e31\u0e1a \u0e2b\u0e25\u0e31\u0e07\u0e08\u0e32\u0e01\u0e19\u0e31\u0e49\u0e19 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 <\/span><span style=\"color: #444444;\">viewport <\/span><span style=\"color: #444444;\">\u0e2d\u0e35\u0e01 \u0e41\u0e25\u0e49\u0e27\u0e2b\u0e32 <\/span><span style=\"color: #444444;\">Breakpoint <\/span><span style=\"color: #444444;\">\u0e15\u0e48\u0e2d\u0e44\u0e1b \u0e17\u0e33\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49\u0e44\u0e1b\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e22\u0e46 \u0e08\u0e19\u0e01\u0e27\u0e48\u0e32\u0e08\u0e30\u0e16\u0e36\u0e07\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e1e\u0e2d\u0e43\u0e08\u0e04\u0e23\u0e31\u0e1a \u0e23\u0e32\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e1c\u0e21\u0e44\u0e14\u0e49\u0e40\u0e02\u0e35\u0e22\u0e19\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e44\u0e27\u0e49\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e41\u0e25\u0e49\u0e27\u0e43\u0e19\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21 \u201c<\/span><a href=\"http:\/\/www.siamhtml.com\/breakpoints-\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23-responsive-web-design\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e23\u0e39\u0e49\u0e08\u0e31\u0e01\u0e01\u0e31\u0e1a <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/breakpoints-\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23-responsive-web-design\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Breakpoints <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/breakpoints-\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23-responsive-web-design\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e43\u0e19 <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/breakpoints-\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23-responsive-web-design\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Responsive web design<\/b><\/span><\/a><span style=\"color: #444444;\">\u201d <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/03\/500x490.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/03\/500x490.png\" alt=\"\" width=\"503\" height=\"493\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e013\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e08\u0e32\u0e01\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e17\u0e35\u0e48\u0e40\u0e25\u0e47\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e2b\u0e32 breakpoints \u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e04\u0e48\u0e2d\u0e22\u0e46 \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 viewport \u0e17\u0e35\u0e25\u0e30\u0e19\u0e34\u0e14<\/span><\/p>\n<h3 class=\"ctl\" align=\"LEFT\"><span class=\"ez-toc-section\" id=\"5_%E0%B8%81%E0%B8%B3%E0%B8%AB%E0%B8%99%E0%B8%94_Viewport_Meta_Tag\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif;\">5. \u0e01\u0e33\u0e2b\u0e19\u0e14 Viewport Meta Tag<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e17\u0e33\u0e07\u0e48\u0e32\u0e22\u0e21\u0e32\u0e01\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e15\u0e48\u0e01\u0e48\u0e2d\u0e19\u0e2d\u0e37\u0e48\u0e19 \u0e1c\u0e21\u0e02\u0e2d\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e16\u0e36\u0e07\u0e2a\u0e32\u0e40\u0e2b\u0e15\u0e38\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e21\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 default settings \u0e02\u0e2d\u0e07 viewport \u0e14\u0e49\u0e27\u0e22 viewport meta tag \u0e01\u0e31\u0e19\u0e01\u0e48\u0e2d\u0e19 \u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e21\u0e35\u0e2d\u0e22\u0e39\u0e48\u0e27\u0e48\u0e32 pixels \u0e21\u0e31\u0e19\u0e21\u0e35\u0e2d\u0e22\u0e39\u0e48 3 \u0e41\u0e1a\u0e1a\u0e14\u0e49\u0e27\u0e22\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a \u0e04\u0e37\u0e2d Physical Pixels, CSS Pixels \u0e41\u0e25\u0e30 Device Pixels<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">Physical Pixels \u0e04\u0e37\u0e2d \u0e08\u0e33\u0e19\u0e27\u0e19 pixels \u0e08\u0e23\u0e34\u0e07\u0e46 \u0e15\u0e32\u0e21 spec \u0e02\u0e2d\u0e07 Device \u0e19\u0e31\u0e49\u0e19\u0e46 \u0e04\u0e23\u0e31\u0e1a \u0e40\u0e0a\u0e48\u0e19 iPhone3 \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 320\u00d7480 \u0e2a\u0e48\u0e27\u0e19 iPhone4 \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 640\u00d7960 \u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19<\/span><\/p>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e2a\u0e48\u0e27\u0e19 <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e19\u0e31\u0e49\u0e19\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19 <\/span><span style=\"color: #444444;\">pixels <\/span><span style=\"color: #444444;\">\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e43\u0e19 <\/span><span style=\"color: #444444;\">CSS declarations <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e2a\u0e21\u0e21\u0e15\u0e34\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14<\/span><code class=\"western\"><span style=\"color: #e64946;\">width:320px<\/span><\/code><span style=\"color: #444444;\">\u00a0<\/span><span style=\"color: #444444;\">\u0e2b\u0e23\u0e37\u0e2d\u00a0<\/span><code class=\"western\"><span style=\"color: #e64946;\">font-size:16px<\/span><\/code><span style=\"color: #444444;\">\u00a0pixels <\/span><span style=\"color: #444444;\">\u0e43\u0e19\u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e08\u0e30\u0e2b\u0e21\u0e32\u0e22\u0e16\u0e36\u0e07 <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e42\u0e14\u0e22\u0e1b\u0e01\u0e15\u0e34\u0e41\u0e25\u0e49\u0e27 <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e08\u0e30\u0e21\u0e35\u0e04\u0e48\u0e32\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a <\/span><span style=\"color: #444444;\">Physical Pixels <\/span><span style=\"color: #444444;\">\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49 <\/span><span style=\"color: #444444;\">Zoom <\/span><span style=\"color: #444444;\">\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d \u0e41\u0e15\u0e48\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32 <\/span><span style=\"color: #444444;\">Zoom <\/span><span style=\"color: #444444;\">\u0e40\u0e02\u0e49\u0e32 \u0e40\u0e23\u0e32\u0e08\u0e30\u0e2a\u0e31\u0e07\u0e40\u0e01\u0e15\u0e27\u0e48\u0e32 \u0e20\u0e32\u0e1e\u0e08\u0e30\u0e02\u0e22\u0e32\u0e22\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 \u0e19\u0e31\u0e48\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e27\u0e48\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e1a\u0e23\u0e32\u0e27\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e08\u0e30\u0e44\u0e1b\u0e02\u0e22\u0e32\u0e22 <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19\u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a \u0e43\u0e19\u0e17\u0e32\u0e07\u0e01\u0e25\u0e31\u0e1a\u0e01\u0e31\u0e19 \u0e16\u0e49\u0e32\u0e40\u0e23\u0e32 <\/span><span style=\"color: #444444;\">Zoom <\/span><span style=\"color: #444444;\">\u0e2d\u0e2d\u0e01 <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e01\u0e47\u0e08\u0e30\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e25\u0e47\u0e01\u0e25\u0e07 \u0e2a\u0e48\u0e07\u0e1c\u0e25\u0e43\u0e2b\u0e49\u0e20\u0e32\u0e1e\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e25\u0e47\u0e01\u0e25\u0e07\u0e04\u0e23\u0e31\u0e1a \u0e0b\u0e36\u0e48\u0e07\u0e19\u0e35\u0e48\u0e01\u0e47\u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e25\u0e31\u0e01\u0e01\u0e32\u0e23\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19 <\/span><span style=\"color: #444444;\">Resolution <\/span><span style=\"color: #444444;\">\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d <\/span><span style=\"color: #444444;\">PC <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e2a\u0e21\u0e21\u0e15\u0e34\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e23\u0e32\u0e21\u0e35 <\/span><span style=\"color: #444444;\">Physical Pixels <\/span><span style=\"color: #444444;\">\u0e40\u0e1b\u0e47\u0e19 <\/span><span style=\"color: #444444;\">1280\u00d71024 <\/span><span style=\"color: #444444;\">\u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19 <\/span><span style=\"color: #444444;\">Resolution <\/span><span style=\"color: #444444;\">\u0e40\u0e1b\u0e47\u0e19 <\/span><span style=\"color: #444444;\">1024\u00d7768 <\/span><span style=\"color: #444444;\">\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e44\u0e1b\u0e01\u0e47\u0e04\u0e37\u0e2d <\/span><span style=\"color: #444444;\">CSS Pixels <\/span><span style=\"color: #444444;\">\u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a<\/span><\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_100.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_100.png\" alt=\"css_pixels\" width=\"207\" height=\"207\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e014\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e17\u0e35\u0e48\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e01\u0e32\u0e23 Zoom 100% CSS Pixels \u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a Physical Pixels<\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_out.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_out.png\" alt=\"css_pixels_zoom_out\" width=\"207\" height=\"207\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e015\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32 Zoom \u0e2d\u0e2d\u0e01 CSS Pixels \u0e08\u0e30\u0e40\u0e25\u0e47\u0e01\u0e01\u0e27\u0e48\u0e32 Physical Pixels<\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_in.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/04\/csspixels_in.png\" alt=\"css_pixels_zoom_in\" width=\"207\" height=\"207\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e016\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32 Zoom \u0e40\u0e02\u0e49\u0e32 CSS Pixels \u0e08\u0e30\u0e43\u0e2b\u0e0d\u0e48\u0e01\u0e27\u0e48\u0e32 Physical Pixels<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e2a\u0e38\u0e14\u0e17\u0e49\u0e32\u0e22\u0e04\u0e37\u0e2d Device Pixels \u0e04\u0e23\u0e31\u0e1a Device Pixels \u0e19\u0e31\u0e49\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19 Pixels \u0e08\u0e33\u0e25\u0e2d\u0e07 \u0e17\u0e35\u0e48\u0e08\u0e30\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e49 application \u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2d\u0e07\u0e04\u0e4c\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e44\u0e14\u0e49\u0e15\u0e23\u0e07\u0e01\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e43\u0e19\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e02\u0e2d\u0e07\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19 \u0e0b\u0e36\u0e48\u0e07\u0e04\u0e48\u0e32\u0e19\u0e35\u0e49\u0e08\u0e30\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e15\u0e32\u0e21 Physical Pixels \u0e41\u0e15\u0e48\u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e15\u0e32\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d(Screen size) \u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e2a\u0e21\u0e21\u0e15\u0e34\u0e27\u0e48\u0e32 device \u0e2b\u0e19\u0e36\u0e48\u0e07 \u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e1e\u0e35\u0e22\u0e07\u0e41\u0e04\u0e48 5 \u0e19\u0e34\u0e49\u0e27 \u0e41\u0e15\u0e48\u0e01\u0e25\u0e31\u0e1a\u0e21\u0e35 Physical Pixels \u0e2a\u0e39\u0e07\u0e16\u0e36\u0e07 1280px \u0e0b\u0e36\u0e48\u0e07\u0e1e\u0e2d\u0e46 \u0e01\u0e31\u0e1a desktop \u0e40\u0e25\u0e22\u0e17\u0e35\u0e40\u0e14\u0e35\u0e22\u0e27 \u0e2d\u0e22\u0e48\u0e32\u0e07\u0e17\u0e35\u0e48\u0e1c\u0e21\u0e1a\u0e2d\u0e01\u0e44\u0e1b\u0e41\u0e25\u0e49\u0e27\u0e27\u0e48\u0e32 CSS Pixels \u0e08\u0e30\u0e21\u0e35\u0e04\u0e48\u0e32\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a Physical Pixels \u0e17\u0e35\u0e48\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e01\u0e32\u0e23 Zoom 100% \u0e19\u0e31\u0e48\u0e19\u0e2b\u0e21\u0e32\u0e22\u0e04\u0e27\u0e32\u0e21\u0e27\u0e48\u0e32 \u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e17\u0e33 responsive web \u0e42\u0e14\u0e22\u0e43\u0e2b\u0e49 viewport \u0e2d\u0e34\u0e07\u0e01\u0e31\u0e1a CSS Pixels \u0e41\u0e25\u0e49\u0e27\u0e25\u0e48\u0e30\u0e01\u0e47 \u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e08\u0e30\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e1a\u0e15\u0e2d\u0e19\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e2d\u0e22\u0e39\u0e48\u0e1a\u0e19 desktop \u0e40\u0e25\u0e22 \u0e17\u0e31\u0e49\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e25\u0e47\u0e01\u0e40\u0e1e\u0e35\u0e22\u0e07\u0e41\u0e04\u0e48 5 \u0e19\u0e34\u0e49\u0e27\u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e19\u0e35\u0e49\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e41\u0e01\u0e49\u0e07\u0e48\u0e32\u0e22\u0e46 \u0e14\u0e49\u0e27\u0e22 Device Pixels \u0e04\u0e23\u0e31\u0e1a \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e43\u0e0a\u0e49 viewport meta tag \u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e43\u0e2b\u0e49 viewport \u0e2b\u0e31\u0e19\u0e21\u0e32\u0e2d\u0e34\u0e07\u0e01\u0e31\u0e1a device-width \u0e41\u0e17\u0e19 \u0e14\u0e49\u0e27\u0e22\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e42\u0e04\u0e49\u0e14\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49<\/span><\/p>\n<div id=\"crayon-560d586d92b0c038552867\" dir=\"LTR\">\n<table border=\"0\" width=\"640\" cellspacing=\"0\" cellpadding=\"2\">\n<colgroup>\n<col width=\"13\" \/>\n<col width=\"619\" \/> <\/colgroup>\n<tbody>\n<tr>\n<td bgcolor=\"#222222\" width=\"13\"><span style=\"color: #898989; font-family: georgia, palatino, serif;\"><span style=\"font-size: small;\">1<\/span><\/span><\/td>\n<td width=\"619\">\n<div id=\"crayon-560d586d92b0c038552867-1\" dir=\"LTR\"><span style=\"font-family: georgia, palatino, serif;\"><span style=\"color: #a6c147;\">&lt;meta <\/span><span style=\"color: #ffa9a9;\">name<\/span><span style=\"color: #c38eba;\">=<\/span><span style=\"color: #ab9b7c;\">&#8220;viewport&#8221;<\/span> <span style=\"color: #ffa9a9;\">content<\/span><span style=\"color: #c38eba;\">=<\/span><span style=\"color: #ab9b7c;\">&#8220;width=device-width, initial-scale=1.0&#8221;<\/span><span style=\"color: #a6c147;\"> \/&gt;<\/span><\/span><\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p><span style=\"font-family: georgia, palatino, serif; font-size: 12pt;\"><span style=\"color: #444444;\">\u0e42\u0e04\u0e49\u0e14 html <\/span><span style=\"color: #444444;\">\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e40\u0e1b\u0e47\u0e19\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e43\u0e2b\u0e49 viewport <\/span><span style=\"color: #444444;\">\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32\u0e43\u0e0a\u0e49\u0e04\u0e48\u0e32 Device Pixels <\/span><span style=\"color: #444444;\">\u0e41\u0e17\u0e19 CSS Pixels <\/span><span style=\"color: #444444;\">\u0e41\u0e25\u0e30\u0e22\u0e31\u0e07\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e43\u0e2b\u0e49\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e0b\u0e39\u0e21\u0e40\u0e1a\u0e37\u0e49\u0e2d\u0e07\u0e15\u0e49\u0e19\u0e40\u0e1b\u0e47\u0e19 100% <\/span><span style=\"color: #444444;\">\u0e2d\u0e35\u0e01\u0e14\u0e49\u0e27\u0e22 \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e43\u0e2a\u0e48\u0e42\u0e04\u0e49\u0e14\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19\u0e19\u0e35\u0e49\u0e40\u0e2a\u0e21\u0e2d\u0e43\u0e19\u0e01\u0e32\u0e23\u0e17\u0e33 Responsive Web Design <\/span><span style=\"color: #444444;\">\u0e04\u0e23\u0e31\u0e1a \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e23\u0e32\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a viewport meta tag <\/span><span style=\"color: #444444;\">\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e2d\u0e48\u0e32\u0e19\u0e15\u0e48\u0e2d\u0e44\u0e14\u0e49\u0e17\u0e35\u0e48 \u201c<\/span><a href=\"http:\/\/www.siamhtml.com\/html-viewport-meta-tag\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>Viewport Meta Tag <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/html-viewport-meta-tag\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23 <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/html-viewport-meta-tag\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>? + <\/b><\/span><\/a><a href=\"http:\/\/www.siamhtml.com\/html-viewport-meta-tag\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #e64946;\"><b>\u0e2a\u0e2d\u0e19\u0e27\u0e34\u0e18\u0e35\u0e43\u0e0a\u0e49<\/b><\/span><\/a><span style=\"color: #444444;\">\u201d<\/span><\/span><\/p>\n<h3 class=\"ctl\" align=\"LEFT\"><span class=\"ez-toc-section\" id=\"6_%E0%B9%80%E0%B8%8A%E0%B9%87%E0%B8%84%E0%B8%81%E0%B8%B1%E0%B8%9A_Devices_%E0%B8%88%E0%B8%A3%E0%B8%B4%E0%B8%87%E0%B9%86\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif;\">6. \u0e40\u0e0a\u0e47\u0e04\u0e01\u0e31\u0e1a Devices \u0e08\u0e23\u0e34\u0e07\u0e46<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e21\u0e32\u0e16\u0e36\u0e07\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e2a\u0e38\u0e14\u0e17\u0e49\u0e32\u0e22\u0e41\u0e25\u0e49\u0e27\u0e04\u0e23\u0e31\u0e1a \u0e19\u0e31\u0e48\u0e19\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e19\u0e33\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e17\u0e33\u0e21\u0e32 \u0e44\u0e1b\u0e25\u0e2d\u0e07\u0e40\u0e1b\u0e34\u0e14\u0e14\u0e39\u0e01\u0e31\u0e1a Devices \u0e08\u0e23\u0e34\u0e07\u0e46 \u0e1a\u0e32\u0e07\u0e04\u0e19\u0e2d\u0e32\u0e08\u0e2a\u0e07\u0e2a\u0e31\u0e22\u0e27\u0e48\u0e32\u0e17\u0e33\u0e44\u0e21\u0e1c\u0e21\u0e16\u0e36\u0e07\u0e41\u0e19\u0e30\u0e19\u0e33\u0e43\u0e2b\u0e49\u0e17\u0e33\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e2a\u0e38\u0e14\u0e17\u0e49\u0e32\u0e22 \u0e17\u0e33\u0e44\u0e21\u0e44\u0e21\u0e48\u0e17\u0e33\u0e44\u0e1b\u0e40\u0e17\u0e2a\u0e44\u0e1b\u0e25\u0e48\u0e30? \u0e01\u0e32\u0e23\u0e17\u0e33\u0e44\u0e1b\u0e40\u0e17\u0e2a\u0e44\u0e1b\u0e19\u0e31\u0e49\u0e19\u0e08\u0e30\u0e44\u0e21\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e27\u0e32\u0e07\u0e41\u0e1c\u0e19\u0e01\u0e32\u0e23\u0e17\u0e33\u0e07\u0e32\u0e19\u0e21\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e35 \u0e16\u0e49\u0e32\u0e2b\u0e32\u0e01\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e46 \u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e17\u0e35\u0e48\u0e1c\u0e21\u0e44\u0e14\u0e49\u0e40\u0e25\u0e48\u0e32\u0e21\u0e32 \u0e41\u0e25\u0e49\u0e27\u0e17\u0e33\u0e15\u0e32\u0e21\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e41\u0e25\u0e49\u0e27\u0e25\u0e30\u0e01\u0e47 \u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e35\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e2a\u0e27\u0e22\u0e07\u0e32\u0e21\u0e43\u0e19\u0e17\u0e38\u0e01\u0e46 Devices \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a \u0e17\u0e33\u0e44\u0e21\u0e16\u0e36\u0e07\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e0a\u0e48\u0e19\u0e19\u0e31\u0e49\u0e19\u0e25\u0e30? \u0e2b\u0e31\u0e27\u0e43\u0e08\u0e02\u0e2d\u0e07\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08\u0e19\u0e31\u0e49\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e17\u0e35\u0e48 3 \u0e41\u0e25\u0e30 4 \u0e04\u0e23\u0e31\u0e1a \u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e17\u0e35\u0e48 3 \u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e17\u0e38\u0e01\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e43\u0e2b\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a relative \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2d\u0e07\u0e04\u0e4c\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e08\u0e30\u0e1b\u0e23\u0e31\u0e1a\u0e15\u0e32\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 viewport \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 \u0e2a\u0e48\u0e27\u0e19\u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e17\u0e35\u0e48 4 \u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14 breakpoints \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e02\u0e36\u0e49\u0e19\u0e42\u0e14\u0e22\u0e21\u0e2d\u0e07\u0e08\u0e32\u0e01 content \u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e25\u0e31\u0e01 \u0e40\u0e23\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e17\u0e35\u0e48\u0e40\u0e25\u0e47\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e01\u0e48\u0e2d\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e04\u0e48\u0e2d\u0e22\u0e46 \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 viewport \u0e17\u0e35\u0e25\u0e30\u0e19\u0e34\u0e14 \u0e1e\u0e2d\u0e40\u0e08\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07 \u0e13 \u0e08\u0e38\u0e14\u0e44\u0e2b\u0e19 \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e2d\u0e22\u0e32\u0e01\u0e1b\u0e23\u0e31\u0e1a \u0e40\u0e23\u0e32\u0e01\u0e47\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e08\u0e38\u0e14\u0e19\u0e31\u0e49\u0e19\u0e40\u0e1b\u0e47\u0e19 breakpoint \u0e41\u0e25\u0e49\u0e27\u0e40\u0e02\u0e35\u0e22\u0e19 media queries \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1b\u0e23\u0e31\u0e1a style sheets \u0e43\u0e19\u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19\u0e19\u0e35\u0e49 \u0e41\u0e21\u0e49\u0e40\u0e23\u0e32\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e40\u0e17\u0e2a\u0e01\u0e31\u0e1a devices \u0e08\u0e23\u0e34\u0e07\u0e46 \u0e40\u0e25\u0e22 \u0e41\u0e15\u0e48\u0e21\u0e31\u0e19\u0e08\u0e30\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e2a\u0e21\u0e40\u0e2b\u0e15\u0e38\u0e2a\u0e21\u0e1c\u0e25\u0e43\u0e19\u0e17\u0e38\u0e01\u0e46 devices \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 \u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e08\u0e32\u0e01\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30 devices \u0e01\u0e47\u0e04\u0e37\u0e2d\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07 viewport \u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e43\u0e19\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e1a\u0e2d\u0e01\u0e27\u0e48\u0e32\u0e21\u0e31\u0e19\u0e08\u0e30\u0e40\u0e27\u0e34\u0e23\u0e4c\u0e04\u0e1a\u0e19 devices \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34 \u0e41\u0e25\u0e49\u0e27\u0e17\u0e33\u0e44\u0e21\u0e22\u0e31\u0e07\u0e15\u0e49\u0e2d\u0e07\u0e21\u0e32\u0e40\u0e0a\u0e47\u0e04\u0e2d\u0e35\u0e01? \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30 devices \u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e21\u0e35\u0e41\u0e04\u0e48 viewport \u0e04\u0e23\u0e31\u0e1a \u0e22\u0e31\u0e07\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e43\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e02\u0e2d\u0e07 os, browser \u0e23\u0e27\u0e21\u0e44\u0e1b\u0e16\u0e36\u0e07\u0e02\u0e49\u0e2d\u0e08\u0e33\u0e01\u0e31\u0e14\u0e1a\u0e32\u0e07\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e23\u0e17\u0e35\u0e48\u0e41\u0e15\u0e48\u0e25\u0e30 devices \u0e2d\u0e32\u0e08\u0e21\u0e35\u0e44\u0e21\u0e48\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19 \u0e43\u0e19\u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49 \u0e40\u0e23\u0e32\u0e22\u0e31\u0e07\u0e04\u0e07\u0e15\u0e49\u0e2d\u0e07\u0e40\u0e0a\u0e47\u0e04\u0e01\u0e31\u0e1a devices \u0e08\u0e23\u0e34\u0e07\u0e46 \u0e2d\u0e22\u0e39\u0e48\u0e04\u0e23\u0e31\u0e1a \u0e41\u0e15\u0e48\u0e2d\u0e32\u0e08\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e21\u0e32\u0e40\u0e09\u0e1e\u0e32\u0e30 devices \u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e1b\u0e49\u0e32\u0e2b\u0e21\u0e32\u0e22\u0e2b\u0e25\u0e31\u0e01\u0e46 \u0e01\u0e47\u0e44\u0e14\u0e49\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p><span style=\"color: #e64946; font-family: georgia, palatino, serif;\"><a href=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/02\/responsive_web_design.png\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color: #dbdbdb;\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/www.siamhtml.com\/wp-content\/uploads\/2013\/02\/responsive_web_design.png\" alt=\"responsive web design\" width=\"643\" height=\"388\" name=\"\u0e01\u0e23\u0e32\u0e1f\u0e34\u0e017\" align=\"BOTTOM\" border=\"1\" \/><\/span><\/a><\/span><\/p>\n<h3 class=\"ctl\" align=\"LEFT\"><span class=\"ez-toc-section\" id=\"%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%88%E0%B8%B2%E0%B8%81_0_%E0%B9%84%E0%B8%9B_100_%E0%B9%80%E0%B8%AA%E0%B8%A1%E0%B8%AD\"><\/span><span style=\"color: #444444; font-family: georgia, palatino, serif;\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01 0 \u0e44\u0e1b 100 \u0e40\u0e2a\u0e21\u0e2d<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"color: #444444; font-family: georgia, palatino, serif; font-size: 12pt;\">\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2a\u0e38\u0e14\u0e17\u0e49\u0e32\u0e22\u0e17\u0e35\u0e48\u0e1c\u0e21\u0e2d\u0e22\u0e32\u0e01\u0e08\u0e30\u0e1d\u0e32\u0e01\u0e44\u0e27\u0e49\u0e04\u0e37\u0e2d Responsive Web Design \u0e15\u0e49\u0e2d\u0e07\u0e40\u0e23\u0e34\u0e48\u0e21\u0e08\u0e32\u0e01 0 \u0e44\u0e1b 100 \u0e04\u0e23\u0e31\u0e1a \u0e1a\u0e32\u0e07\u0e04\u0e19\u0e21\u0e35\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e2d\u0e22\u0e39\u0e48\u0e41\u0e25\u0e49\u0e27 \u0e41\u0e25\u0e49\u0e27\u0e2d\u0e22\u0e32\u0e01\u0e17\u0e33 Responsive Web Design \u0e01\u0e47\u0e40\u0e25\u0e22\u0e40\u0e02\u0e35\u0e22\u0e19\u0e42\u0e04\u0e49\u0e14\u0e40\u0e1e\u0e34\u0e48\u0e21 \u0e0b\u0e36\u0e48\u0e07\u0e1c\u0e21\u0e44\u0e21\u0e48\u0e41\u0e19\u0e30\u0e19\u0e33\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e22\u0e34\u0e48\u0e07\u0e04\u0e23\u0e31\u0e1a \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e08\u0e30\u0e40\u0e01\u0e34\u0e14\u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e2d\u0e22\u0e48\u0e32\u0e07\u0e15\u0e32\u0e21\u0e21\u0e32 \u0e44\u0e21\u0e48\u0e27\u0e48\u0e32\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19 \u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e04\u0e27\u0e32\u0e21\u0e0b\u0e49\u0e33\u0e0b\u0e49\u0e2d\u0e19\u0e02\u0e2d\u0e07\u0e42\u0e04\u0e49\u0e14 scope \u0e02\u0e2d\u0e07\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e0a\u0e31\u0e14\u0e40\u0e08\u0e19 \u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e08\u0e32\u0e01\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e16\u0e39\u0e01\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e40\u0e2d\u0e32\u0e44\u0e27\u0e49\u0e15\u0e31\u0e49\u0e07\u0e41\u0e15\u0e48\u0e41\u0e23\u0e01 \u0e23\u0e27\u0e21\u0e44\u0e1b\u0e16\u0e36\u0e07\u0e04\u0e27\u0e32\u0e21\u0e22\u0e38\u0e48\u0e07\u0e22\u0e32\u0e01\u0e43\u0e19\u0e01\u0e32\u0e23\u0e1e\u0e31\u0e12\u0e19\u0e32 \u0e2d\u0e32\u0e08\u0e40\u0e01\u0e34\u0e14\u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e41\u0e01\u0e49\u0e08\u0e38\u0e14\u0e2b\u0e19\u0e36\u0e48\u0e07 \u0e44\u0e1b\u0e01\u0e23\u0e30\u0e17\u0e1a\u0e2d\u0e35\u0e01\u0e08\u0e38\u0e14\u0e2b\u0e19\u0e36\u0e48\u0e07 \u0e44\u0e21\u0e48\u0e08\u0e1a\u0e44\u0e21\u0e48\u0e2a\u0e34\u0e49\u0e19\u0e44\u0e14\u0e49\u0e04\u0e23\u0e31\u0e1a \u0e01\u0e32\u0e23\u0e08\u0e30\u0e17\u0e33 Responsive Web Design \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e21\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e35\u0e15\u0e31\u0e49\u0e07\u0e41\u0e15\u0e48\u0e41\u0e23\u0e01\u0e40\u0e23\u0e34\u0e48\u0e21\u0e04\u0e23\u0e31\u0e1a \u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e43\u0e0a\u0e49\u0e40\u0e27\u0e25\u0e32\u0e15\u0e23\u0e07\u0e19\u0e35\u0e49\u0e43\u0e2b\u0e49\u0e21\u0e32\u0e01\u0e46 \u0e23\u0e31\u0e1a\u0e23\u0e2d\u0e07\u0e07\u0e32\u0e19\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e14\u0e35\u0e41\u0e19\u0e48\u0e19\u0e2d\u0e19\u0e04\u0e23\u0e31\u0e1a<\/span><\/p>\n<p align=\"CENTER\">\n","protected":false},"excerpt":{"rendered":"<p>\u0e04\u0e32\u0e14\u0e27\u0e48\u0e32\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e04\u0e19 \u0e04\u0e07\u0e40\u0e04\u0e22\u0e2d\u0e48\u0e32\u0e19\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a Responsive Web  [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":1488,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[264,6],"tags":[815,813,812,811,816,817,818,810,809,242,231,628,802,803,804,808,807,806,805,456],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v14.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>6 \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19 \u0e01\u0e32\u0e23\u0e17\u0e33 Responsive Web Design - MakeWebEasy Blog<\/title>\n<meta name=\"robots\" content=\"index, follow\" \/>\n<meta name=\"googlebot\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta name=\"bingbot\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.makewebeasy.com\/blog\/responsive-web-design-2\/\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"6 \u0e02\u0e31\u0e49\u0e19\u0e15\u0e2d\u0e19 \u0e01\u0e32\u0e23\u0e17\u0e33 Responsive Web Design - MakeWebEasy Blog\" \/>\n<meta name=\"twitter:description\" content=\"\u0e04\u0e32\u0e14\u0e27\u0e48\u0e32\u0e2b\u0e25\u0e32\u0e22\u0e46 \u0e04\u0e19 \u0e04\u0e07\u0e40\u0e04\u0e22\u0e2d\u0e48\u0e32\u0e19\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a Responsive Web [&hellip;]\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/www.makewebeasy.com\/th\/blog\/wp-content\/uploads\/2015\/10\/Blog-19.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@makewebeasy\" \/>\n<meta name=\"twitter:site\" content=\"@makewebeasy\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","_links":{"self":[{"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/posts\/1487"}],"collection":[{"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/comments?post=1487"}],"version-history":[{"count":10,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/posts\/1487\/revisions"}],"predecessor-version":[{"id":14983,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/posts\/1487\/revisions\/14983"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/media\/1488"}],"wp:attachment":[{"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/media?parent=1487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/categories?post=1487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.makewebeasy.com\/th\/blog\/wp-json\/wp\/v2\/tags?post=1487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}