带有溢出 SVG 背景的 HTML 按钮

标签 html css twitter-bootstrap svg

我正在尝试实现以下目标:我正在使用 Bootstrap 、标准 btn 类。

enter image description here

到目前为止,背景图片的位置是正确的,但它被截断了。我试过 overflow: visible; 等...

.btn {
  background: url('../images/button.svg') no-repeat;
  background-repeat: no-repeat;
  background-position: left;
  padding-left: 80px;
}


<button class="btn btn-default btn-lg">GET A FREE QUOTE <i class="fa fa-chevron-right" aria-hidden="true"></i></button>

enter image description here

感谢您的帮助

最佳答案

您好,您可以使用下面的代码,我已将您的 png 文件上传到 mediafire。我还删除了您图片的背景。这是链接:http://www.mediafire.com/view/ddv9ce54d08488m/Ky5ME_burned.png

<!DOCTYPE html>
<html>
<head>

<a href="http://google.com">
<input type="image" src="Ky5ME_burned.png" alt="Submit" width="660" height="174">
</a>


</head>
</html>

关于带有溢出 SVG 背景的 HTML 按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43135942/

相关文章:

html - ionic 元素的右下边框

css - 将 SVG 指定为背景图像并在 CSS 中设置 SVG 样式?

html - 添加链接帮助 - 将当前页面的地址添加到我创建的每个链接的开头?

twitter-bootstrap - Bootstrap ,带有下拉菜单的工具提示,在按钮组中似乎有效果

javascript - 为什么Bootstrap 5.2.1 在分页Datatable 时导致modal 隐藏?

html - 显示的列跨度 : table-cell

javascript - 如何在可移动的 javascript 元素中插入按钮?

c# - 如何在 C# (.NET) 中使用 POST 变量登录 HTML 表单?

html - 幻灯片文本搜索框被覆盖

javascript - 使用 jQuery 垂直居中 div