【前端】一文读懂display: inline-block

display: inline-block是CSS中的一个属性值，用于设置元素的显示模式。它结合了inline和block的特点，即既能保持元素在一行内排列，又能设置元素的宽高、内外边距等样式。display:

inline-block常用于创建水平导航栏、网格布局等场景，具有较高的灵活性和兼容性。

display: inline-block的特点如下：

• 元素会在一行内排列，直到容器的宽度不足时才会换行。
• 元素可以设置宽高、内外边距等样式，不受父元素或子元素的影响。
• 元素的垂直对齐方式由vertical-align属性控制，默认为baseline。
• 元素之间会产生空白间隙，这是由于HTML源码中的换行符或空格导致的。可以通过设置font-size: 0或使用注释符来消除间隙。

下面这串代码可以实现文字居中对齐（包含最后一行）：

       label{
          font-size: 18px;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #000000;
          line-height: 32px;
          text-align: center;
          display: inline-block;
        }