CSS scale（）不适用于Android Chrome 70和其他版本

我想在价格标签前显示一个彩色小点。圆点应垂直居中，靠近价格，并稍微放大

这适用于chrome桌面、iOS、Safari等

但在Android上，这个点很大，占据了整个div的空间

.item.green:：在{
内容：“●";
颜色：#7ED321；
}
.项目{
转换：比例（1.4）；
显示：内联块；
垂直对齐：文本顶部；
}
.价格文本{
底部：20px；
}

1.050 €

考虑一个简单的背景，您可以轻松调整大小和位置

也可以考虑CSS变量来调整颜色：

.priceText{
左侧填充：15px；
背景：径向梯度（var（-c，#7ED321）4px，透明5px）/*4px半径*/
左中心/*位置*/
/
10px 10px/*尺寸：必须至少为2x半径*/
不重复；
}
.橙色{
--c:橙色；
}

1.050 €
1.050 €

您可以使用媒体查询来控制屏幕大小缩小到Android时会发生什么

@media screen and (min-width: 400px) {
  .items {
    transform: scale(1.4);
  }
}

---

不错！颜色怎么能很容易调整？目前我正在为项添加另一个类：.item.orange:：after{content:：●“颜色：#F5A623；}哇！你们让我目瞪口呆。我猜你们是在一个完全不同的层次上。我从来没见过--c标记。这是CSS3吗？它似乎在我测试过的所有浏览器上都能工作。@merlin是的，它是CSS，你们可以在这里阅读更多信息：……它得到了很好的支持，你们只会在IE上遇到问题，但我想这并不奇怪；）