我不能去掉字母之间的间隔。即使使用0px字母间距，它仍然有太多的空间。
我不能去掉字母之间的间隔。即使使用0px字母间距，它仍然有太多的空间。
提问于 2018-12-12 20:14:11
我想要为每个单独的字母设置样式，我遇到了一个问题，我的字母间距是关闭的，唯一的解决方案是提供一个负的字母间距，但是这就产生了另一个问题，那就是我的悬停效果被-x像素关闭了。
<div class="main">
<!-- Header -->
<div class="header" id="home">
<h1 aria-label=" Hi, I’m Brandon, Developer." style="letter-spacing:0px;">
<span class="blast" aria-hidden="true" style="opacity: 1;">H</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">i</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">,</span>
<br> <span class="blast" aria-hidden="true" style="opacity: 1;">I</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">’</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">m</span>
<span class="blast" aria-hidden="true" style="opacity: 1;"> </span>
<span class="blast" aria-hidden="true" style="opacity: 1;">B</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">r</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">a</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">n</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">d</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">o</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">n</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">,</span>
<br> <span class="blast" aria-hidden="true" style="opacity: 1;">D</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">e</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">v</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">e</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">l</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">o</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">p</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">e</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">r</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">.</span>
</h1>
<h2><strong>Software Developer</strong></h2>
</div>
<!-- /Header -->
</div>
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-12-12 20:20:03
通过删除HTML中span标记之间的所有空格，我使它看起来是正确的。
编辑:很抱歉格式化错误，这里有一个代码笔：https://codepen.io/anon/pen/yGYojm
<div class="main">
<!-- Header -->
<div class="header" id="home">
<h1 aria-label=" Hi, I’m Brandon, Developer." style="letter-spacing:0px;">
<span class="blast" aria-hidden="true" style="opacity: 1;">H</span><span
class="blast" aria-hidden="true" style="opacity: 1;">i</span><span class="blast" aria-
hidden="true" style="opacity: 1;">,</span>
<br> <span class="blast" aria-hidden="true" style="opacity: 1;">I</span>
<span class="blast" aria-hidden="true" style="opacity: 1;">’</span><span class="blast"
aria-hidden="true" style="opacity: 1;">m</span><span class="blast" aria-hidden="true"
style="opacity: 1;"> </span><span class="blast" aria-hidden="true" style="opacity:
1;">B</span><span class="blast" aria-hidden="true" style="opacity: 1;">r</span><span
class="blast" aria-hidden="true" style="opacity: 1;">a</span><span class="blast" aria-
hidden="true" style="opacity: 1;">n</span><span class="blast" aria-hidden="true"
style="opacity: 1;">d</span><span class="blast" aria-hidden="true" style="opacity:
1;">o</span><span class="blast" aria-hidden="true" style="opacity: 1;">n</span><span
class="blast" aria-hidden="true" style="opacity: 1;">,</span>
<br> <span class="blast" aria-hidden="true" style="opacity: 1;">D</span><span
class="blast" aria-hidden="true" style="opacity: 1;">e</span><span class="blast" aria-
hidden="true" style="opacity: 1;">v</span><span class="blast" aria-hidden="true"
style="opacity: 1;">e</span><span class="blast" aria-hidden="true" style="opacity:
1;">l</span><span class="blast" aria-hidden="true" style="opacity: 1;">o</span><span
class="blast" aria-hidden="true" style="opacity: 1;">p</span><span class="blast" aria-
hidden="true" style="opacity: 1;">e</span><span class="blast" aria-hidden="true"
style="opacity: 1;">r</span><span class="blast" aria-hidden="true" style="opacity:
1;">.</span>
</h1>
<h2><strong>Software Developer</strong></h2>
</div>
<!-- /Header -->
</div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53750676
复制相关文章
相似问题
腾讯云开发者
