Html 在提交按钮中间的半透明三角形形状

我试图让表单上的提交按钮看起来像这样：（中间是一个半透明的三角形）

这就是我目前的情况：

---

这是否仅适用于CSS？任何帮助都将不胜感激。

使用透明PNG图像作为提交按钮的背景图像应该可以

background: url(subscribe.png) transparent no-repeat;

编辑：

---

为了澄清这一点，当然，图像的背景应该是橙色的，中间有一个三角形。

有一种非常简单的方法可以做到这一点，它甚至不需要CSS3，只需要使用css2伪类。需要注意的重要变化是，您不能在input等内联元素上应用伪类，因此我必须将input submit按钮更改为button元素

以下是附加代码：

html:
<form>
<input type="text" name="email" value="enter your email address" class="besedilo" />
<button type="submit" name="subscribe" value="subscribe" class="submit">Subscribe</button>
</form>

css:
button { position: relative; }
button:after {
content: '';
position: absolute;
top: 14px; right: 17px;
height: 0; width: 0;
border-top: solid 6px transparent;
border-left: solid 6px #fff;
border-bottom: solid 6px transparent;
}

html：
订阅
css:
按钮{位置：相对；}
按钮：之后{
内容：''；
位置：绝对位置；
顶部：14px；右侧：17px；
高度：0；宽度：0；
边框顶部：实心6px透明；
左边框：实心6px#fff；
边框底部：实心6px透明；
}

如果您只使用位图作为按钮，这会容易得多。如果可能的话，我只想使用CSS来实现这一点。这可能可以使用复杂的css3变换和旋转等等来实现。但幸好用图像可以避免这种头痛。同意罗迪克的观点。这样一个按钮的CSS最终可能是closw大小的必要PNG文件：）我想我会用一个图像。谢谢！：）我不知道我昨天做了什么（我想是有点晚了），但这不是我想要实现的。你可以在这里看到结果：www.esport.si-arrow在开头。