javascript - 如何使用css使字体比900更厚

Question

由于网站标题中我的 friend 图像的背景颜色，我想让我的字体超粗。我在网上找到了这个，但不幸的是它不起作用。有没有其他方法可以做到这一点？

h1{
  text-shadow: 1px 0 #888888;
  letter-spacing:1px;
  font-weight:bold;
}

<h1>MAKE IT BOLD</h1>

上面的这不起作用，并保持与我已经拥有的相同标准厚度。
请让我知道其他解决方案。

Answer 1

使用 text-stroke

.box {
  letter-spacing: 5px;
  font-size: 30px;
  font-weight: 900;
  font-family:sans-serif;
}
.th {
  -webkit-text-stroke: 3px;
  text-stroke: 3px;
}

<div class="box">HELLO WORLD</div>
<div class="box th">HELLO WORLD</div>

或者很多文字阴影:

.box {
  letter-spacing: 5px;
  font-size: 30px;
  font-weight: 900;
  font-family:sans-serif;
}
.th {
  text-shadow:0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px,0 0 2px;
}

<div class="box">HELLO WORLD</div>
<div class="box th">HELLO WORLD</div>