Cara Menggunakan Inspect Element

Apa sih yang dimaksud dengan Inspect Element? Dan apa kegunaan dan manfaat dari Inspect Element? Sebagian blogger mungkin sudah tahu dengan yang namanya Inspect Element. Kalau menurut saya, Inspect Element adalah sebuah alat atau tools yang digunakan untuk melihat dan menganalisa struktur suatu halaman di internet. Inspect Element sendiri bisa kita temukan di browser Firefox. Saya sendiri sering menggunakan Inspect Element ini untuk mengedit tampilan blog saya. Simak juga, blog Fadhly berganti template. Saya banyak belajar mengenai koding-koding css dari Inspect Element ini. Awalnya, saya menggunakan Inspect Element ini hanya untuk mengetes apakah tampilan blog saya sudah responsive atau belum. Serta, mengetahui kode warna html yang dipakai pada suatu situs. Pokoknya, banyaklah fungsi dari Inspect Element ini.

Lalu bagaimana cara menggunakan Inspect Element? Caranya cukup mudah. Berikut ini tutorial menggunakan Inspect Element, yaitu:

  1. Akseslah suatu halaman di internet dengan menggunakan Firefox. Contohnya, dalam hal ini saya mengakses blog Fadhly untuk menganalisa struktur css-nya
  2. Setelah itu, klik kanan lalu pilih Inspect Element:
    1. Menggunakan Inspect Element
  3. Kemudian, nanti akan muncul tampilan dari Inspect Element seperti gambar dibawah ini:
    2. Menggunakan Inspect Element

Pada gambar diatas terlihat kode css yang saya gunakan. Serta juga tampil, kode warna yang saya pakai di blog Fadhly. Kalau kita merubah kode warnanya dengan menggunakan Inspect Element, maka tampilan blog saya akan berubah warna. Walau pun tampilan blog saya berubah ketika menggunakan Inspect Element, tapi perubahan tersebut tidak tersimpan kok. Kalau diklik refresh, maka tampilan blog saya akan normal kembali. Sesuai namanya, Inspect Element ini digunakan untuk menganalisa struktur halaman web.

Sebelum saya mengedit template, biasanya saya menggunakan Inspect Element ini untuk percobaan. Setelah tampilan blog sesuai dengan yang saya inginkan, barulah perubahan yang saya lakukan di Inspect Element saya terapkan di template blog saya. Sehingga, akan lebih mudah. Tinggal Inspect Element bagian yang ingin kita edit, dan semuanya beres. Heheh.. Saya pernah menulis mengenai, tampilan footer tidak mau rapi. Lalu, solusinya saya rapikan dengan menggunakan Inspect Element.

M. Fadhly

Hanya seorang yang gemar berbagi apa yang diketahui. Jangan lupa follow Twitter saya di @MF4dhli

3 Replies to “Cara Menggunakan Inspect Element

  1. Dengan Inspect Element… banyak kode juga yang bisa dilihat atau dilacak ya Mas…
    Terima kasih atas share artikelnya… 😀

  2. z punya script utk hack gmail, lewat inspect element, dn brhasil, trnyata browser punya klemahan yg dpt kiya gunakan ya !

Leave a Reply

Your email address will not be published.