HTML Single Page website with Pseudo elements

Deepak Mishra
2 min readFeb 3, 2022

DLithe_BC_NFS_T_Task11_HTMLPseudoelements

03/02/2022

Task Details:

Requirements(SINGLE PAGE)

1. Webpage should have a heading with text properties
2. Webpage should have proper content (about HTML and CSS)
3. Use Pseudo elements for the content in your webpage.
4. Use Opacity and overflow properties in your webpage.
5. Use float properties in your web page.

What we are going to used in this task

what is Pseudo elements?

A CSS pseudo-element is used to style specified parts of an element.

For example, it can be used to:

  • Style the first letter, or line, of an element
  • Insert content before, or after, the content of an element

Opacity and overflow

The opacity property sets the opacity level for an element.The opacity-level describes the transparency-level, where 1 is not transparent at all, 0.5 is 50% see-through, and 0 is completely transparent.

The float property specifies whether an element should float to the left, right, or not at all.

none :The element does not float, (will be displayed just where it occurs in the text).

left: The element floats to the left of its container

right: The element floats the right

Output of the task:

Github Code: https://github.com/deepaksmishra/DLithe_Bootcamp_DeepakMishra/tree/main/Pseudoelements

--

--