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

Question

我正在尝试在我的表单上提交一个提交按钮，如下所示：http://nulaena.si/temp/triangle.jpg（中间的半透明三角形）。

这是我的时刻：http://jsfiddle.net/ptinca/UJUAT/3/

这可能仅适用于CSS？任何帮助都感激不尽。

Answer 1

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

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

编辑：

为了澄清，图像应具有橙色背景在它的三角形，当然。

Answer 2

有一种非常简单的方法可以做到这一点，甚至不需要CSS3，但只能使用css2伪类。最重要的变化需要注意的是，你不能上内联元素，例如输入应用伪类，所以我不得不改变你的输入提交按钮，一个按钮元素

这里的附加代码：

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; 
}