Display Property:

  • This specifies how an element should be displayed.
  • Syntax: display: value
  • Values are
    1. inline
    2. block
    3. none
  • Default value is based on type of html element.
  • Block level elements: <p>,<h1>-<h6>,<form>,<div>.
  • Inline elements: <span>, <a>, <img>.
  • None: It turns off the display and removes the element completely from the document. 
  • Block elements always starts on new line. We can add margins and padding in block.
  • Inline elements don't start on new line.
    1. They appear on the same line.
    2. we can add space to the left and right on an inline element,
    3. we you cannot add height to the top or bottom padding or margin of an inline element.

     Code:
    
    Output:
    

 Visibility Property:

  • This property determines whether an element is visible or hidden.
  • Syntax: visibility: value.
  • Values are visibility and hidden.
  • visibility is the default value and the content will be visible.
  • hidden: the box or content will be invisible.
     Code: 
     
    Output: