如何在HTML中显示“ <-”，使破折号位于“大于”符号曲线的中间？

问题描述

我正在做我的第一个html作业，其中一项要求是在链接的文本内以两个破折号组合显示“大于”符号（如图所示，希望您能看到它）。

这是我的样子：

这是我的代码：

解决方法

这主要取决于字体大小和行高，因此我想您以这种方式使用SVG图标。有关这种方式，请参见Material Icons。但是，如果您想要使用显示的纯字体，则可以使用此CSS和HTML

div {
  display: flex;
  border-bottom: 1px solid black;
  width: fit-content;
  cursor: pointer
}

<div onclick="Task1.html">
    <p style="margin: 0;">&lt;</p>
    <p style="margin: 0; margin-top: -2px;">--</p>
    <p style="margin: 0; margin-left: 8px">Back</p>
</div>

但是我再说一遍，我永远不会喜欢这种方法！

您不应使用当前的文字方法。关于您现在如何使用HTML元素，您的课程老师已经过时了约20年。

可以使用HTML symbols绘制任何字体大小和行高的完美箭头。

<div>
    <a href='Task1.html'>&larr; Back</a>
</div>

这是更干净的（同时包含CSS和HTML），更简单，并且始终可以在任何浏览器上随时使用。

您可以使用huge list of possible HTML entities，因此您无需选择我在这里使用过的箭头。

如果您想要更复杂的字形（图标），则可以使用名为font-awesome的东西，其中有很多这样的东西并且有免费版本。该系统已经被数百万个网站使用。它使用CSS加载带有自定义形状的自定义字体，以处理诸如“主页”按钮，信封，大型企业品牌等更复杂的事物。

html symbols