Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CC
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for Educator.com

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Web Tools Within the Browser

  • Each browser has tools built into the browser to assist you with web development
  • We will look at Internet Explorer (IE), Chrome, and Firefox tools
  • Since IE is wide spread and many companies are still working in older versions, you need to be able to view your web pages across various versions of IE
  • The IE Developer tools allow you to do this by choosing the browser mode option
  • We open the IE, Firefox and Google Chrome developer tools to take a look at what information you can obtain about your web pages

Web Tools Within the Browser

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Looking at Different Browsers 0:09
    • Internet Explorer
    • Use the Same Version as the Company
  • IE Developer Tools 1:04
    • F12
    • Pin It
    • Understanding Developer Tools
    • The Arrow
    • Crossed Out Styles
    • Select Parts to Observe
  • Google Chrome Tools 4:07
    • F12
    • Elements
    • Understanding Developer Tools
    • Magnifying Glass
  • Safari Tools 5:26
    • F12
    • Shortcuts Are a Little Different
    • Safari Extension
  • Firefox Tools 6:33
    • F12
    • Firefox Menu
    • Web Developer
    • Understanding Web Developer
    • Add-Ons
    • Inspector
    • Tools For You
    • Box Model