[CSS] CSS / Pseudo-elements

#css

Pseudo-elements select specific parts of an element.

::first-line

• ::first-line selects the first line of the element.
• For example, the following sets the text color of the first line of the p element to red.

p::first-line {
  color: red;
}

::first-letter

• ::first-letter selects the first letter of the element.
• For example, the following sets the color of the first letter of the p element to red.

p::first-letter {
  color: red;
}

::before

• ::before selects before the element.
• For example, the following puts the word xyz in front of the p element and makes it red.

p::before {
  content: "xyz";
  color: red;
}

::after

 

• ::after selects after the element.
• For example, the following puts the word xyz after the p element and sets the color to red.

p::after {
  content: "xyz";
  color: red;
}

::selection

 

• ::selection selects the text selected by mouse dragging etc.

 

 

 

#css grammar #css basic #css tag #css Pseudo-elements #Pseudo elements #Pseudo-elements #selector #css selector