ถ้ากำลังสร้างเว็บไซต์หรือ ศึกษาโครงสร้างการเรียกใช้ภาพ, Script, CSS ฯลฯ สามารถแก้ไขค่าต่างๆ ได้เสมือนกับแก้ไขค่าในไฟล์จริง โดยไม่กระทบกับไฟล์จริงเป็นเพียงการจำลอง
ตัว Add on คู่บุญของ Browser Firefox จะช่วยให้ทุกสิ่งดูง่ายขึ้น สามารถ Dowload และติดตั้งได้เองจากเว็บไซต์
https://getfirebug.com/ เปิด Browser ขึ้นมาแล้ว
กด F12 หรือ คลิกไอคอน
1. คลิกที่ไอคอนดังรูป แล้วเลือกจุดหรือ Element ที่ต้องการตรวจสอบ
2. แท็บ Style คือส่วนที่เราใช้ดูว่า Element ดังกล่าวเรียกใช้ CSS ตัวไหนอยู่คุณสามารถทำการ Hide หรือแก้ไขตัวเลขได้
3. คือไฟล์เต็มที่เรียกมาใช้ ตามตัวอย่างเมื่อคลิกจะไปที่แท็บ CSS ซึ่งบางครั้งไฟล์อาจถูกเรียกมาจากที่อื่นมันจะขึ้นข้อความว่า "<system>" อย่างที่พอจะเข้าใจว่าเป็น Ghost file
4. ในส่วนนี้เป็น HTML เราสามารถจะแก้ไขไฟล์ได้เช่นกัน เป็น index ที่เรียกใช้ไฟล์ทุกชนิด มีการเรียกใช้ในแท็ก <head> ดังนี้
<head>
<title>Money management</title>
<script type="text/javascript" src="js/jquery.selectBox.js"></script>
<link type="text/css" rel="stylesheet" href="css/style.css"/>
</head>
ถ้าเรียกใช้ไฟล์ .css จะเป็น <link> ถ้าเป็นไฟล์ .js ของ Jquery จะใช้ <script>
