To specify how an element functions in the document,Classification properties is used.
You have to specify the display properties of an element explicitly or the browser won't know how to display it to format XML documents .
white-space
To specify how the white space in the code of an element should be treated,the white-space attribute is used.
It takes one of three possible values:
1.normal - ignore all extra spaces and all carriage returns
2.pre- preserve al extra spaces and all carriage returns
3.nowrap - do not break the element across lines
CSS Code of "normal" white-space
<p style="white-space: normal;">
Duis autem vel eum iriure dolor
in hendrerit in vulputate velit
esse molestie consequat, vel illum
dolore eu feugiat nulla facilisis.
</p>
visibility
To specify whether an element is visible or hidden,this property is used.
This means whether an element shows up in the document or not,you can specify. This means that you can create hidden elements that become visible when certain events occur.
CSS Code with visibility set to "hidden".
<p style="visibility: hidden;">
Duis autem vel eum iriure dolor
in hendrerit in vulputate velit
esse molestie consequat, vel illum
dolore eu feugiat nulla facilisis.
</p>
Visible is the default.
This property is most commonly used with client-side scripting for Dynamic HTML.
display
To specify how an element displays,the display property is used . It defines, in a sense, what kind of element it is. You are not really expected to know how this works yet, merely that it does.
It takes one of the following values:
none - do not display
block
inline
list-item
run-in - item runs into the following content, like an inline heading
compact
marker
table
inline-table
table-row-group
table-header-group
table-footer-group
table-row
table-column-group
table column
table-cell
table-caption
For Dynamic HTML pages,the only place you will currently see this property used in an XHMTL document as collapsing (or clamshell) menus, where the property is flip-flopped between none and (usually) block.
Here is a 2x2 table.
Without the use of table tags,it is made. Some divisions is used, modified with the display: property.
If your browser does not support using the display then you can't see a 2x2 grid of table cells, then : property this way with XHTML.
Note that this is not a recommended practice, but makes for a good example.
<div style="display: table;">
<div style="display: table-row;">
<div style="display: table-cell;">
Here is a 2x2 table.
</div>
<div style="display: table-cell;">
It is made without the use of table tags. ...
</div>
</div>
<div style="display: table-row;">
<div style="display: table-cell;">
If you don't see a 2x2 grid of table cells, ...
</div>
<div style="display: table-cell;">
Note that this is not a recommended practice, ...
</div>
<p>
In the example above, we let the the a element float to the left and ul element .
In inline elements ,the li elements will be displayed(no line break before or after the element). This forces the list to be on one line.
The ul element has a width of 100% and each hyperlink in the list has a width of
6em (6 times the size of the current font).
To make it more fancy,we add some colors and borders .
</p>
</body>
</html>
The follwing table describe the classification Properties:
Property
Description
values
clear
Sets the sides of an element where other floating elements are not allowed
left right both none
cursor
Specifies the type of cursor to be displayed
url auto crosshair default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help
