DEV Community

Dev Learner
Dev Learner

Posted on

CSS Visibility Concept

CSS Visibility is an important concept. It can easily express the visibility of an element.
Today I will try to give you an idea about this important concept of CSS.
CSS Visibility is a CSS property that indicates whether an element will remain visible or invisible in the user interface.There are many kinds of visibility value.
These are visible,hidden,initial,collapse,inherit etc.
Visible Definition: It is the default value. It is means any element are visible,you can provide it.It gives specific hight and width. If you can change hight and width, you will do it.
Hidden Definition: It inticates that the element is invisible but stay same hight and width.
Initial Definition : It is set property from it’s default value.
Inherit Definition: It set property from its parents value.
Collapse Definition: It is used only for table element. It removes column or row.That means you can invisible column or row,you can use collapse value.

Example Of CSS Visibility:

<!DOCTYPE html>


       This is CSS Visibility Item

    </title> 

    <style> 

        h3 { 

            color:Goldenrod
        } 

.visibility{
visibility :visible;
}
.visibility-hidden{
visibility:hidden;
}

</head> 

<body> 

    <h1>Welcome Naim's blogs page</h3> 

Time and wait for none <\p>

Time and wait for none <\p>

</body> 

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay