Element Inspector

Introduction

The Element Inspector is enabled by default. Inspector allows you to select the elements by clicking on them on the page.

What Is The CSS Selector?

The selector points to the HTML element you want to style, CSS selectors are as an address to the HTML elements. When you choose an element, YellowPencil generates the selector for the target element automatically.

We recommend you to start styling the page after completing the page template. If the page template change, some selectors may not be valid. Don’t forget, CSS selectors are the address of HTML elements.

Flexible Inspector

The flexible selector allows you to select the elements. This inspector may select other elements that are similar to the target element.

Some dynamic elements cannot be selected by clicking on them. Please mouse over the element you want to select and press the space key.

Single Inspector

This tool allows you to select only the clicked element.

The Flexible inspector may select more elements than one, but Single inspector selects just the target element clicked. We recommend you to use Single inspector only when needed.

Tips: The wireframe tool helps you to display the website’s layout and the elements so you can select the elements easily.

Selecting Multiple Elements

You can select multiple elements easily. After selecting an element, click on another element while hold on the shift key to select additional elements.

Note: The editor is generating single selectors for additional element selections.

Cursor

This is a normal cursor. Use it to navigate pages. All elements and links on your website will be active.

Tips: Use the cursor tool to turn off a popup or change tabs or slide the slider.
Was this article helpful?
YesNo
Live Editor