如何仅使用CSS消除重音 [英] How to get rid of accents just with CSS

问题描述

在不使用JS的情况下，我想使用CSS删除重音，以便HTML继续在语义上正确，而在视觉上实现不带重音的大写.

Without using JS, I wanted to remove accents with CSS so the HTML continues semantically correct while visually achieving UPPERCASE without accents.

示例:

h1 {
  text-transform: uppercase;
  /*sth here*/
}

<h1>Fácil</h1>

谢谢！

推荐答案

您可以调整line-height并使用overflow:hidden，但要注意，当使用其他font-family时，您可能需要另一个值:

You can adjust the line-height and use overflow:hidden but pay attention when using a different font-family you may need another value:

h1 {
  text-transform: uppercase;
  line-height: 0.75em;
  overflow: hidden;
}

<h1>Fácil é â ä</h1>
<h1 style="font-size:25px">Fácil é â ä</h1>
<h1 style="font-size:18px">Fácil é â ä</h1>

与另一个font-family:

h1 {
  font-family:arial;
  text-transform: uppercase;
  line-height: 0.87em;
  overflow: hidden;
}

<h1>Fácil é â ä</h1>
<h1 style="font-size:25px">Fácil é â ä</h1>
<h1 style="font-size:18px">Fácil é â ä</h1>

这篇关于如何仅使用CSS消除重音的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！