About US
          Contact Us

CSS Display

Chapter - 18 : Display, Visibility Float and Transparency (CSS Display): (Page 1/4)

In this chapter the display and visibility of various elements are explained.
These are important to improve the look of the web page.

18.1- Display of Element: As explained earlier the block element takes the full width available, and has a line break before and after it. An inline element only takes up as much width as necessary, and does not force line breaks. If we require special display, we can change an inline element to a block element, or vice versa to make the web page look elegant. But changing the display type of an element changes only the way the element is displayed,

To change from block element to inline element
h1 {display:inline;}

To change from inline element to block element
span {display:block;}

18.2- Hiding an Element: We can hide the element by two ways

i) By making its property hidden:
p.hidden {visibility:hidden;}
In this case, the property will be there in the web page but it will not be visible. Since this is present in the page, therefore it will take its space.

ii) By making its property in-visibility:
p.hidden {display:none;}
In this case the property will neither visible nor it will take any space and for all purposes, it is treated as if it is not there.

(Cont......... to next page (Pg-2))

CSS Display © funandhobby.com (CSS Display)