# Pseudo Selector

The Pseudo Selector gives access to a drop down menu where you can choose between different special states or pseudo-classes of the selected element(s). Available are Hover, Active, Focus, Before, After, but others can be added as required.

# Hover

The Hover pseudo-class modifies the properties of a block when the pointer hovers over it.

1. Select a block
2. Open the block inspector
3. Find the Pseudo Selector
4. Select Hover in the drop down menu
5. Modify the required properties from the highlighted options

# Active

The Active pseudo-class modifies the properties of a block when you click it.

1. Select a block
2. Open the block inspector
3. Find the Pseudo Selector
4. Select Active in the drop down menu
5. Modify the required properties from the highlighted options

# Focus

The Focus pseudo-class represents an element (such as a form input) that has received Focus. It is usually triggered when the user clicks or taps on an element or selects it with the keyboard's Tab key.

1. Select a block
2. Open the block inspector
3. Find the Pseudo Selector
4. Select Focus in the drop down menu
5. Modify the required properties from the highlighted options

# Before

The Before pseudo-class allows you to insert content before any non-replaced element.

1. Select a block
2. Open the block inspector
3. Find the Pseudo Selector
4. Select Before Before in the drop down menu
5. Modify the required properties from the highlighted options

The After pseudo-class allows you to insert content after any non-replaced element.

1. Select a block
2. Open the block inspector
3. Find the Pseudo Selector
4. Select After in the drop down menu
5. Modify the required properties from the highlighted options