HTML CSS Reference/CSS Attributes and Javascript Style Properties/display

Материал из Web эксперт
Перейти к: навигация, поиск

"display" Example

   <source lang="html4strict">

<html> <head> <style> .style1 { 

   display:none

} </style> <script language="JavaScript"> function function1() { 

   item1.style.display="";
   item2.style.display="none";
   item3.style.display="none";
   }

function function5() { 

   item1.style.display="";
   item2.style.display="";
   item3.style.display="";
   }

function function6() { 

   item1_1.style.visibility="visible";
   item2_1.style.visibility="visible";
   item3_1.style.visibility="visible";
   }

</script> </head> <body>

header 1 header 2 Header 3
Cars item 1 item 2
item 3 item 4 High
item 5 item 6 Slow

<input type=button style="width:175" onclick="function1()" value="Show some "> <input type=button style="width:175" onclick="function6();function5()" value="Reset">

  • Item 1 ? Double-click me
  • Item 2
  • Item 3
  • Item 4
  • Item 5

</body> </html> 


     </source>


"display" is applied to

   <source lang="html4strict">

+----------------+--------------------------------------------------------------+ | Applied_To |<a> <acronym> | | |<address> <applet> | | | |

| |
|

| |<body>
| | |<button> |

| |
|

| | <col> | | |<colgroup> currentStyle | | |<custom>

| | |defaults | | | <dir> |

| |
|

| |

| | |<embed> <fieldset> | | | <form> | | |<frame> <hn> |

| |
<html> |

| | <iframe> | | |<img> <input type="button"> | | |<input type="checkbox"> <input type="file"> | | |<inputtype="image"> <input type="password"> | | |<input type="radio"> <input type="reset"> | | |<input type="submit"> <input type="text"> | | | | | |<label> <legend> |

| |
  • <listing> | | |<marquee> <menu> | | |<nobr> <object> | | |
      <p> | | |
                                                            |
|                |                                                    |
|                |                                                     |
|                |<select>                                               |
|                |                                                |
|                |                        style                         |
|                |                                                    |
|                |                         <tbody>                       |
|                |                          |
|                |                                                       |
|                |
                                                             |
|                |<xmp>                                                         |
+----------------+--------------------------------------------------------------+
      
      </source>
    
   



        "display" Possible Values
        

            <source lang="html4strict">
Possible Values
block                 rendered as a block element, with border features, that occupies 
                      a new line.

        inline                The default; generate one or more boxes without occupying a new 
                      line.

        none                  not rendered.
compact               Creates either a block or an inline element, depending on the 
                      content of the element.
inline-block          The element is rendered inline,
list-item             (IE6+) generate a principal block box and list-item inline box 
                      with border features.
table-header-group    displays the element as a table header group.
table-footer-group    displays the element as a table footer group.    


              
      </source>


           


        

        

        "display" Syntax and Note
        

            <source lang="html4strict">
Note:
Whether to draw an element.
Syntax:

        element { display: value }
elementID.style.display = "value"
document.all.elementID.style.display = "value" // IE only


              
      </source>

        

      

      


                                  <textarea>                    |
|                |<tfoot>                                                   |
|                |<thead>

    • Источник — «http://wbex.ru/index.php?title=HTML_CSS_Reference/CSS_Attributes_and_Javascript_Style_Properties/display&oldid=6303»