首页 > Web开发 > 详细

图片与文字居中对齐css

时间:2020-04-04 20:11:02      阅读:78      评论:0      收藏:0      [点我收藏+]

图片与文字居中对齐css

* 方法

1. 给图片和文字元素都设置:`vertival-align:center`

* 示例

1. HTML

```html
<h3>
  <svg
    fill="none"
    stroke="currentColor"
    stroke-linecap="round"
    stroke-linejoin="round"
    stroke-width="2"
    viewBox="0 0 24 24"
    class="w-8 h-8"
  >
    <path
      d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01"
    />
  </svg>
  <span>待办事项</span>
</h3>
```

2. CSS

```css
span {
  vertical-align: middle;
}
svg {
  width: 25px;
  vertical-align: middle;
}
```

图片与文字居中对齐css

原文:https://www.cnblogs.com/hgwq/p/12633717.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!