Question

我有一个名为Dalton Empire 的网站。

当用户复制“DaltonEmpire”时，我希望将“Dalton Empire”添加到他们的剪贴板中。

我只找到了一个解决方案;使用空格，但制作letter-spacing -18px。是不是有一个更简洁的解决方案，例如HTML字符？

我的示例JSFiddle和代码：

span.nospace {
  letter-spacing: -18px;
}

<ol>
  <li>Dalton<b>Empire</b></li>
  <li>Dalton&zwnj;<b>Empire</b></li>
  <li>Dalton&zwj;<b>Empire</b></li>
  <li>Dalton&#8203;<b>Empire</b></li>
  <li>Dalton<span class="nospace"> </span><b>Empire</b> <i>The only one that works</i>
  </li>
</ol>

Answer 1

你看起来像这样：

HTML空间： ？

Answer 2

您可以使用word-spacing。但是，要创建更具动态性的属性，您需要使用em单元。这样单位基于字体大小，因此实际上支持所有字体系列和字体大小：

ol li
{
    word-spacing: -.2em;
}

em不是绝对单位 - 它是一个相对于单位的单位目前选择的字体大小。

来源：Why em instead of px?

jsFiddle

Answer 3

您还可以使用font-size: 0; demo

span.nospace {
        font-size: 0;
    }

Answer 4

这是一些有趣且相关的信息。它不能解决您的问题，但它可能会帮助那些正在寻找创建可选换行符的方式的人，就像我一样。零宽度空间和<wbr>元素是两种可能的选项。

Answer 5

这个怎么样？看起来很整洁：

ol li{
    word-spacing: -4px; /* just enter an appropriate amount here */
}

您现在可以删除nospace span。

Answer 6

您可以提供margin-left或Font-size CSS属性

DEMO

span.nospace {

    margin-left: -4px; /* or font-size:0px */
}

HTML字符 - 隐形空间

6 个答案:

jsFiddle