ทดสอบ Responsive Design ฟรีดูหน้าเว็บของคุณในทุกขนาดหน้าจอพร้อมกัน

ใช่ ไม่ต้องมีบัญชี ไม่จำกัดจำนวนอุปกรณ์หรือหน้าเว็บ ไม่มีลายน้ำบนภาพหน้าจอ และไม่ต้องติดตั้งอะไร ทำงานในเบราว์เซอร์ของคุณ

ป้อนที่อยู่เว็บไซต์หรือวาง HTML แล้วเลือกจากขนาดมือถือ แท็บเล็ต แล็ปท็อป และเดสก์ท็อปมากกว่า 40 ขนาด ทีละจอหรือเคียงข้างกัน ลากกรอบเพื่อกำหนดความกว้างใดก็ได้ หมุนจอ หรือสลับไปยัง breakpoint ที่ใช้บ่อย

แต่ละกรอบเป็น viewport ของเบราว์เซอร์ที่มีความกว้างและความสูงเท่ากับหน้าจอนั้นในหน่วยพิกเซล CSS ดังนั้น media query เลย์เอาต์ และ breakpoint จะตอบสนองเหมือนบนอุปกรณ์นั้นทุกประการ

ได้ วาง HTML หรือเปิดไฟล์ .html เพื่อดูตัวอย่างในทุกขนาดและแก้ไขแบบสด เว็บไซต์จะโหลดผ่าน https สำหรับเซิร์ฟเวอร์พัฒนาในเครื่อง ให้ใช้ https tunnel หรือวาง HTML ที่ build แล้ว

ได้ ใน HTML ของคุณ เครื่องมือจะแจ้งองค์ประกอบที่กว้างกว่าหน้าจอ ซึ่งเป็นสาเหตุหลักของการเลื่อนด้านข้างบนมือถือ และเตือนเมื่อไม่มีเมตาแท็ก viewport

ได้ สำหรับ HTML ที่วาง: บันทึกส่วนที่มองเห็นหรือทั้งหน้าเป็น PNG ที่อัตราส่วนพิกเซลของอุปกรณ์ กรอบกว้าง 393 พิกเซลที่ 3x จะได้ภาพกว้าง 1179 พิกเซล

มือถือใส่พิกเซลจริงสองถึงสี่พิกเซลในแต่ละพิกเซล CSS ป้ายนี้แสดงอัตราส่วนดังกล่าว และภาพหน้าจอของ HTML ที่วางจะบันทึกที่อัตราส่วนนั้น จึงคมชัดเท่าหน้าจอจริง

ไม่ เบราว์เซอร์ของคุณโหลดเว็บไซต์จากเซิร์ฟเวอร์ของเว็บนั้นโดยตรงภายในกรอบ ไม่มีพร็อกซีคั่นกลาง HTML ที่วางและภาพหน้าจออยู่ในเบราว์เซอร์ของคุณ หน้าล่าสุดและการตั้งค่าจะเก็บไว้ในพื้นที่จัดเก็บของเบราว์เซอร์นี้

บางเว็บไซต์เลือกไม่ให้แสดงภายในหน้าอื่น เปิด "ทำไมถึงว่าง?" เพื่อตรวจสอบ header ของเว็บไซต์ หรือวาง HTML ของหน้านั้นแทน