如何在链接中上标

Question

＆＃13;

＆＃13;

.project-link {
font-family:Arial; 
display:inline-block;
color:#FFF;
font-size:5vw;
white-space:nowrap;
text-decoration:underline;
margin-right: 3%;
line-height:120%;
}
body {
  background-color: black;
}

＆＃13;

<a class="project-link" id="one" href="#modal1">Maru Speaker Design <sup> (1) </sup> </a>
<

＆＃13;

＆＃13;

＆＃13;

我试图让（1）成为上标。

编辑 https://jsfiddle.net/v1jn1nus/

使用Arial字体添加了图片。

我只是不明白。它也适用于小提琴......

Answer 1

那是vertical-align:super;所以检查你的风格是否没有重置该元素的垂直对齐。

检查一下：

.project-link {
font-family:Arial; 
display:inline-block;
color:#FFF;
font-size:5vw;
white-space:nowrap;
text-decoration:underline;
margin-right: 3%;
line-height:120%;
}

.project-link > span { vertical-align:super; }

body {
  background-color: black;
}

<a class="project-link" id="one" href="#modal1">Maru Speaker Design <span> (1) </span> </a>
<