Javascript examples for CSS Style Property:display
The display property sets or gets the element's display type.
| Value | Description |
|---|---|
| block | displayed as a block-level element |
| compact | displayed as a block-level or inline element. Depends on context |
| flex | displayed as a block-level flex box. New in CSS3 |
| inherit | The value of the display property is inherited from parent element |
| inline | displayed as an inline element. This is default |
| inline-block | displayed as a block box inside an inline box |
| inline-flex | displayed as a inline-level flex box. New in CSS3 |
| inline-table | displayed as an inline table (like <table>), with no line break before or after the table |
| list-item | displayed as a list |
| marker | This value sets content before or after a box to be a marker |
| none | Element will not be displayed |
| run-in | displayed as block-level or inline element. Depends on context |
| table | displayed as a block table (like <table>), with a line break before and after the table |
| table-caption | displayed as <caption> |
| table-cell | displayed as <td> and <th> |
| table-column | displayed as <col> |
| table-column-group | displayed as <colgroup> |
| table-footer-group | displayed as <tfoot> |
| table-header-group | displayed as <thead> |
| table-row | displayed as <tr> |
| table-row-group | displayed as <tbody> |
| initial | Sets this property to its default value. |
| inherit | Inherits this property from its parent element. |
| Item | Value |
|---|---|
| Default Value: | inline |
| Return Value: | A String, representing the display type of an element |
| CSS Version | CSS1 |
Get a <div> element's display:
<!DOCTYPE html> <html> <body> <p id="myP" style="display:none;">This is a p element.</p> <button type="button" onclick="myFunction()">Return the display type of p</button> <script> function myFunction() {// w w w. j a v a 2s.co m console.log(document.getElementById("myP").style.display); } </script> </body> </html>