CSS – Visibility
CSS – Visibility
The visibility property permits to hide an element in the browser. To create very complex menu and web page layout, this property is mainly used with JavaScript. To hide answers of quiz or error messages, this property can be used. This property has following values,
Visible: The elements are shown to the user.
Hidden: The elements are invisible but they must have effect on the page-layout.
Collapse: For dynamic table row and column effects, this value is used.
Example,
<html>
<head>
<style type = "text/css">
table.one {visibility:collapse; }
td.a {
border-style:solid;
border-width:3px;
}
td.b {
border-style:solid;
border-width:3px;
}
</style>
</head>
<body>
<p>
This paragraph should be visible in normal way.
</p>
<p style = "visibility:hidden;">
This paragraph should not be visible.
</p>
<p style = "visibility:visible;">
This paragraph should be visible.
</p>
<table class="one" border="1">
<tr><td class = "a"> Cell 1</td></tr>
<tr><td class = "b"> Cell 2</td></tr>
</table>
</body>
</html>
Output:
The visibility property permits to ---- an element in the browser.
