【发布时间】：2010-12-17 21:45:13
【问题描述】：
这是我的目标。带透明度的倾斜标签在另一个顶部。如果不使用 jpg 或 png，而只使用 css，我将如何构建它？
【问题讨论】：
-
圆角可以吗？还是需要倾斜
-
这很难仅靠 CSS 实现。当然，你可以用 javascript 做一些疯狂的事情，但绝对不值得你仅仅使用图片来节省时间。
【发布时间】：2010-12-17 21:45:13
【问题描述】：
这个 tuts 会让你继续前进，但我会试着在一分钟内模拟一些东西！
http://www.howtocreate.co.uk/tutorials/css/slopes
http://net.tutsplus.com/articles/news/fun-with-css-shapes/
顺便说一句，好问题！
编辑：
这是“最终”结果：
看here！
注意：
请注意，这是一个“黑客”，实际实施它可能不是最好的主意，我认为（现在不能尝试）IE 对此有一些问题，如果您询问可用性和可访问性，我想说的是图片:)
【讨论】：
-
这很酷，但是如果我想像我的图像一样在标签周围添加一个实心笔触怎么办？如果有角度的标签已经是边框，那会有点困难，不是吗？
-
@WillingLearner 让我看看.. 可能是！！
-
@WillingLearner n我现在想不出任何与 css 相关的东西，因为你不能把它们放在另一个上面，而且你已经准备好使用边框 jsfiddle.net/Trufa/2Uf3H/4 但我猜你可以使用一张图片，但我知道这不是你的问题！
是否必须使用 CSS，或者您只是希望不使用光栅图像？例如，您可以使用 SVG 背景图像，它的文件大小可能比光栅图像更小，并且可以更好地缩放。如果您担心 HTTP 请求，可以使用数据 uri。如果您不想使用背景图像，也可以使用 SVG 或 png 作为边框图像。
【讨论】：
我对此的看法是使用 CSS 来创建角度： http://www.howtocreate.co.uk/tutorials/css/slopes 或者 http://www.dinnermint.org/blog/css/creating-triangles-in-css/
您将选项卡的“结束”部分创建为白色/黑色的角度，然后使用 jquery 应用透明度和选择。
这应该可以帮助您在没有图像的情况下开始。
【讨论】：