
Here, we’ve added the font-weight: bold CSS rule, making the element’s text bold. Uncheck any of the check boxes to temporarily deactivate the rule, click the text to change a rule, or add your own rules to the element at the top of the panel.

You can also edit the element’s CSS straight from the Rule panel. To help you find specific CSS properties, the computed panel includes a search box. You can switch between Rules and Computed by clicking the Rules and Computed buttons. (Remember to bring up the Web Developer Menu just use your cursor to right-click anywhere on the webpage).Ĭlick on the Style button to see the CSS rules that are being applied to the selected element and there’s also a CSS Computed panel. If you want to see the webpage’s HTML in a flat file, you can also select View Page Source from the Web Developer Menu.
#Firefox scratchpad software
The HTML Inspector will allow you to expand and collapse the HTML tags, making it easy to visualize your changes right on the page – very similar to WYSIWYG software like Adobe Dreamweaver. You can also go back and forth between parent and child code elements by clicking the breadcrumbs on the Inspector toolbar.Ĭlick on the HTML button to view the HTML code of your selected element. Mozilla Firefox will then highlight the element under your cursor as you maneuver it across the page. If you want to select a new element on the page, click the Inspect button on the toolbar, hover your mouse over the page and click you element. Your selected element will be highlighted and other elements on the webpage will be dimmed out. You will then see a toolbar at the bottom of the webpage, which you can then use to control the Inspector and check out all the elements on the page.

You can also launch the Inspector right from the Web Developer menu. You can inspect a specific element’s code by right-clicking it and selecting Inspect (or by pressing Q on your keyboard).
#Firefox scratchpad for free
All of these tools are available absolutely for free under Web Developer in Firefox’s menu. Mozilla Firefox’s new web developer features, combined with top of the line Firefox web developer addons like Firebug and Web Developer Toolbar, make Mozilla Firefox the ideal internet browser for web developers. In this tutorial you’ll learn about Firefox’s all-new Inspector tool and updated Scratchpad. Mozilla Firefox’s Web Developer menu has tools for inspecting internet pages, running JavaScript code, and viewing HTTP requests and other relevant messages.
