[分享]css中display属性对应的值

CSS中的display属性用于定义元素在页面上的显示方式，其值有很多种，下面我们来一一介绍： / display值为block的元素会以块级元素的方式显示 / .block { display: b...

CSS中的display属性用于定义元素在页面上的显示方式，其值有很多种，下面我们来一一介绍：

 /* display值为block的元素会以块级元素的方式显示 */
  .block {
    display: block;
  }

  /* display值为inline的元素会以行内元素的方式显示 */
  .inline {
    display: inline;
  }

  /* display值为inline-block的元素会以行内块级元素的方式显示 */
  .inline-block {
    display: inline-block;
  }

  /* display值为none的元素不会在页面上显示，类似于被隐藏了起来 */
  .none {
    display: none;
  }

  /* display值为flex的元素会以弹性盒子的方式显示 */
  .flex{
    display: flex;
  }

  /* display值为inline-flex的元素会以行内弹性盒子的方式显示 */
  .inline-flex{
    display: inline-flex;
  }

  /* display值为grid的元素会以网格布局的方式显示 */
  .grid{
    display: grid;
  }

  /* display值为inline-grid的元素会以行内网格布局的方式显示 */
  .inline-grid{
    display: inline-grid;
  } 

以上就是关于CSS中display属性对应的值的介绍，希望能对你有所帮助！