วิธีการทดสอบเว็บไซต์ Responsive บน Smart phone ด้วย Chrome

Booststap Knowledge ความรู้สำหรับการออกเว็บเพื่อให้แสดงผล ได้ดี ทุกหน้าจอ

Moderators: mindphp, ผู้ดูแลกระดาน

User avatar
pnut
PHP Super Member
PHP Super Member
Posts: 488
Joined: 08/08/2016 10:48 am

วิธีการทดสอบเว็บไซต์ Responsive บน Smart phone ด้วย Chrome

Post by pnut » 12/10/2016 12:24 pm

:like: วิธีการทดสอบเว็บไซต์ Responsiveบน Smart phone ด้วย Chrome :like:
วันนี้เราจะแนะนำวิธีการทดสอบเว็บไซต์ Responsive บน Smart phone ด้วย Chromeโดยในแต่ละครั้งในการออกแบบเว็บไซต์นั้น บางครั้งต้องการดูผลลัพธ์บนอุปกรณ์แท็บแล็ต หรือมือถือต่างๆ ซึ่งความละเอียดของหน้าจอนั้นๆจะแตกต่างกันออกไป ซึ่ง Chome จะมีเครื่องมือที่ช่วยให้แสดงผลบนอุปกรณ์ Smart phone โดยไม่ติดตั้งโปรแกรมเสริมใดๆเลย แถมวิธีการก็จะแสนง่ายดาย โดยมีวิธีการทดสอบดังนี้
1.ให้ไปที่ More tools
2.คลิก Doveloper tools ดังภาพ
2.png
2.png (227.09 KiB) Viewed 548 times
3.เลือกที่รูปโทรศัพท์ ดังภาพ
3.png
3.png (129.18 KiB) Viewed 548 times
4.ก็จะแสดงผลลัพธ์การทดสอบเว็บไซต์ Responsive บน smart phone
5.jpg
5.jpg (59.03 KiB) Viewed 548 times
5.โดยเราสามารถเลือกการแสดงตามอุปกรณ์ที่ต้องการได้และสามารถเลือกแสดงเป็นแนวนอนหรือแนวตั้งได้
6.png
6.png (70.6 KiB) Viewed 548 times
ตัวอย่างการแสดงผลบนอุปกรณ์ I-PHONE6 แนวนอน www.mindphp.com
7.jpg
7.jpg (52.74 KiB) Viewed 547 times

Return to “Booststap Knowledge”

Users browsing this forum: No registered users and 3 guests