.
do not copy code using translator
PSEUDO CLASSEScss pseudo classesMobile browsers may not use all the optionsyou must first create a normal class i.e myclass .
Then you create another class with the same name + the pseudo class.
When adding the class to the element select the normal class NOT the pseudo classactiveThis class controls how a element looks when clicked
click me.act { background-color: red; }.act:active { background-color: yellow; font-size: 150%; }hoverThis class controls how a element looks when the cursor or mouse passes over it
hover over me.hov { background-color: red; }.hov:hover { background-color: fuchsia; font-weight: bold; }unvisitedThis class controls how unvisited links look
click me.unv { background-color: yellow; }.unv:link { background-color: aqua; }visitedThis controls how a visited link looks
click me.vis { background-color: yellow; }.vis:visited { background-color: green; }focusFocus is similar in effect to "active" but is used for text input elements
.inp { background-color: yellow; }.inp:focus { background-color: lime; } PSEUDO ELEMENTSThe pseudo elements only work on "block" level elements like <div> and <p> the XtGem text block cannot use them
First_letter & First linefirst letterThis adds a style to the first letter of a element
This is First letter of the text
.firstlett { background-color: yellow;}.firstlett:first-letter { background-color: red; font-size: 200%; border-width: 1px; border-style: solid; border-color: black; }first lineThis adds a style to the first line of a element
This is First line of the text
this is the second line
.firstline { background-color: yellow;}.firstline:first-line { color: green; }Before & After