图像上的价格标签

Question

如何在图像（使用纯CSS）上获得价格标签，例如此附加图像中的价格？

我用过

content:'';
    width:0px; height:0px; 
    position: absolute; left:194px; top:-20px;
    border:10px solid;
    border-color: transparent transparent rgba(0,0,0,0.8) transparent;

但它没有帮助!!

Answer 1

尝试类似http://jsfiddle.net/chriscoyier/xtCb9/1/

的内容

Answer 2

您可以执行某些操作like this

假设您在'tag'id div中有一个价格标签的图像，然后是它下面的图像

修改

我现在更新了这个，所以你可以拥有一些like this你可以在div中得到它的价格

Answer 3

目前尚不清楚您目前获得的结果，但它不起作用。所以也许你应该进一步说明问题。

对于仅在CSS中创建三角形，您可以查看此CSS技巧，但不允许将文本或样式添加到三角形中：http://css-tricks.com/snippets/css/css-triangle/

如果你想要，你应该使用变换来获得类似的结果。