css - CSS3 标签标签朝右并使用位置或 :after

Question

我正在尝试在 CSS 中构造这个形状：

在此处输入图像描述

但我不知道如何将三角形（考虑到标签的“主体”有一个矩形，尖端有一个三角形）朝向右侧。因为我正在处理位置，当标签都可以有不同的大小时，我怎么能告诉三角形出现在矩形之后？我就是搞不定。

您可以检查小提琴： http: //jsfiddle.net/ExZFe/，其标签与我正在制作的标签相似。这个例子只使用了位置，所以给三角形一个固定的位置是没有用的。由于同样的原因，我尝试了 :after 但也被卡住了。我错过了什么？先感谢您。

score 3 · Accepted Answer

right只需使用属性（从矩形的右侧开始）而不是left（从矩形的左侧开始，在这里没用，因为你不知道标签的宽度）来定位三角形： http:// jsfiddle.net/Gv3rf/

score 0 · Accepted Answer

只需在 .tag 中添加一个 line-height

.tag {
line-height: 10px;
/* the rest of your styles here */
}

2 回答 2