时间戳

首页 > 解决方案 > 将 svg 图像定位在 span 下

css - 将 svg 图像定位在 span 下

问题描述

我想在一段文本下放置一个 svg 图像。我不想在 svg 中包含一些空间，因为我会将它与各种大小的文本一起使用。

尝试了一堆css样式，但似乎无法得到它。

CSS：

  .a_underline{
            background: url('~/images/highlight.svg');
            background-repeat: no-repeat;
            background-size: contain;
            padding-bottom: 30px;
            }

HTML：

I would like to <span class="a_underline">underline</span> some text

我结束了这个！

结果

希望橙色 svg 低于“下划线”

标签： csssvgposition

解决方案

你必须玩background position设置在底部。检查片段。

.a_underline {
  background: url('https://dummyimage.com/200x5/000/fff') bottom center;
  background-repeat: no-repeat;
  background-size: contain;
  padding-bottom: 5px;
}
I would like to <span class="a_underline">underline l ldlvjnlvnnlkk bkbk</span> some text

推荐阅读