Question

我在网站上放置了UTF箭头＆＃10148，我有两个问题：

如何设置颜色？
我可以将其旋转为向上箭头吗？我在UTF箭头中看不到＆＃10148的等效向上箭头样式。

这是我现在使用的代码：

a.UTF_uparrow {
  font-size: 15pt;
  color: rgb(140, 173, 255);
}

<a href="#bkmkAA" class="UTF_uparrow" style="text-decoration: none">&#10148;</a>

与其他页面元素不同，无论我在CSS代码中选择哪种颜色，该颜色始终默认为鲑鱼色，我希望它向上，而不是正确。

感谢您的帮助。

Answer 1

UTF字符是文本，因此from inspect import getfile class A: pass getfile(A.__class__)属性是正确的。必须有一个规则，将鲑鱼颜色应用到更高的specificity。

您可以在浏览器的开发工具中使用Inspector来查找哪个CSS规则覆盖了Traceback (most recent call last): File "classtest.py", line 5, in <module> getfile(A.__class__) File "/Library/Frameworks/Python.framework/Versions/3.7/lib/python3.7/inspect.py", line 653, in getfile raise TypeError('{!r} is a built-in class'.format(object)) TypeError: <module 'builtins' (built-in)> is a built-in class选择器。检查Computed标签，该标签按特异性顺序列出了应用于所选元素的所有规则。

color

a.UTF_uparrow

就查找向上箭头而言，我建议您找到合适的UTF字符，而不要尝试旋转此箭头。如果您不喜欢任何UTF字符的外观，则可以始终尝试使用图标字体。您还应该注意，UTF字符的外观因用户的操作系统而异，因此无论如何您都不会获得与它们一致的外观。

Answer 2

先添加display:inline-block或block，然后再添加transform:rotate(-90deg);。颜色正确...在此演示中您仍然看到鲑鱼色吗？如果不是这样，则通过尝试!important（不推荐）或将类链接以获得更高的特异性来覆盖样式，例如：

a.UTF_uparrow.UTF_uparrow.UTF_uparrow {...

a.UTF_uparrow {
  display: inline-block;
  font-size: 15pt;
  color: rgb(140, 173, 255);
  transform: rotate(-90deg);
}

a.small {
  font-size: 7pt;
}

<a href="#bkmkAA" class="UTF_uparrow" style="text-decoration: none">&#10148;</a>

<a href="#bkmkAA" class="UTF_uparrow small" style="text-decoration: none">&#10148;</a>

如何设置UTF箭头的样式➤

2 个答案: