在我的<li>项目中添加css形状？</li>

Question

我正在尝试在适当的地方使用css形状而不是图像。

目前我的目标是在<li>链接的末尾添加白色三角形，如下所示：

Here's a JSFiddle让你调整。

我已经使用了一段时间，但作为一名新手开发者，我一直无法找到方法！导航栏的内容位于css和html的底部。我试图通过尽可能使用em和百分比来保持结果的响应性，这个三角形的形状高度需要与nav_option类相同（如果文本通过窗口调整被敲入下一行，它的高度可以加倍）

任何建议/解决方案？非常感谢！

编辑：如果由于我的相对字体大小而无法做到这一点，请详细说明另一种解决方案？建议使用Javascript是有帮助的，但对于像我这样的新手来说有点模糊。

Answer 1

字体大小与上升元素的字体大小相关，不与父元素的宽度或高度相关。因此，要使用响应式字体大小，请尝试使用一些jquery插件（FitText）或构建一个JS。

http://fittextjs.com/

Answer 2

因为您使用边框黑客来制作此形状，所以您需要使用的测量，font-size，无法应用。您需要一个JavaScript解决方案来检测换行并相应地调整边框尺寸。