บทความวิกิฮาวนี้จะแนะนำวิธีการตรวจสอบซอร์สโค้ด HTML ขององค์ประกอบภาพของหน้าเว็บใน Google Chrome โดยใช้คอมพิวเตอร์
ขั้นตอน
ขั้นตอนที่ 1. เปิด Google Chrome บนคอมพิวเตอร์
ไอคอน Chrome ดูเหมือนลูกบอลสีสันสดใสโดยมีจุดสีน้ำเงินอยู่ตรงกลาง คุณจะพบไอคอนนี้ในโฟลเดอร์ "Applications" บนคอมพิวเตอร์ Mac หรือเมนู "Start" บนคอมพิวเตอร์ Windows
ขั้นตอนที่ 2 คลิกไอคอนจุดแนวตั้งสามจุด
ข้างแถบ address มุมขวาบนของหน้าต่างเบราว์เซอร์ หลังจากนั้น เมนูแบบเลื่อนลงจะปรากฏขึ้น
ขั้นตอนที่ 3 วางเมาส์เหนือเครื่องมือเพิ่มเติมในเมนูแบบเลื่อนลง
หลังจากนั้น เมนูย่อยจะปรากฏขึ้น
ขั้นตอนที่ 4 คลิกเครื่องมือสำหรับนักพัฒนาในเมนูย่อย "เครื่องมือเพิ่มเติม"
คอลัมน์การตรวจสอบจะปรากฏขึ้นที่ด้านขวาของหน้าต่างเบราว์เซอร์
หรือเปิดหน้าต่างการตรวจสอบโดยใช้แป้นพิมพ์ลัดก็ได้ กด Option+⌘ Cmd+I บนคอมพิวเตอร์ Mac และ Ctrl+Alt+I บนคอมพิวเตอร์ Windows
ขั้นตอนที่ 5. วางเมาส์เหนือองค์ประกอบในคอลัมน์การตรวจสอบ
เมื่อวางเคอร์เซอร์ไว้เหนือองค์ประกอบหรือเส้นในหน้าต่างการตรวจสอบ องค์ประกอบที่เกี่ยวข้องจะถูกทำเครื่องหมายบนหน้าเว็บ
ขั้นตอนที่ 6 คลิกขวาที่องค์ประกอบที่คุณต้องการตรวจสอบบนหน้าเว็บ
เมนูคลิกขวาจะปรากฏในกล่องดรอปดาวน์
ขั้นตอนที่ 7 เลือก ตรวจสอบ บนเมนูแบบเลื่อนลง
หลังจากนั้นคอลัมน์ตรวจสอบจะเลื่อนขึ้นหรือลงไปยังองค์ประกอบนั้น ซอร์สโค้ดขององค์ประกอบจะถูกตั้งค่าสถานะ