1. CSS 基础

  2. 取值单位

  3. 外观样式

  4. 布局样式

  5. 动画样式

  6. 工具与规范

  7. 实例练习

display: inline-block; 可以将一个元素设置为行内块元素,行内块元素集合了块级元素与行内元素的特点。

  • 可与其他行内元素共处一行。
  • 可以设置宽高。
  • 默认宽高为内容的宽高。
  • 行内块元素可以包含块级元素或行内元素。

行内块元素的居中

行内块元素居中与行内元素居中类似,都是设置父元素的 text-align: center;

<iframe height="300" style="width: 100%" scrolling="no" title="演示" src="https://codepen.io/3yya/embed/OJOaJMj?default-tab=css%2Cresult&editable=true&theme-id=light" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true"></iframe>