Question

我有以下HTML：

ggplot(df %>% filter(value %in% 1), aes(x, y)) +
  geom_hex() + 
  coord_equal() +
  scale_y_continuous(trans = scales::reverse_trans()) +
  scale_fill_gradient(low = "red", high = "green", guide = FALSE) +
  theme_void()

我的期望是在<html> <body> hi hi <br> <span> hi hi </span> </body> </html>之前会有空格，它们对应于跨度中它们之前的空格。但是，这些空格未在Chrome中呈现：

为什么空格字符不会在我的范围内呈现？

Answer 1

输出是一个HTML网页，在HTML中，多个空格折叠为一个空格。标签的开头和结尾处的空格不可见。

你可以用css解决这个问题：

.showSpaces{
  white-space: pre;
}

并在html中设置类

<span class="showSpaces">          hi   hi   </span>

完整示例

.showSpaces{
  white-space: pre;
}

<html>

    <body class="showSpaces">
           hi   hi    
           <br>
           <span>          hi   hi   </span>

    </body>
</html>

另一种选择是在HTML中使用<pre>标记。

Answer 2

使用不间断空格html实体： 

在您的示例中，使用CSS移动文本可能是更好的做法。

Answer 3

我的期望是在hi hi之前会有空格对应于跨度中它们之前的空格。

默认情况下，即使应用更多空格，单词之间也只提供一个空格。克服这个问题的一种方法是使用不间断的空间   。

<span>&nbsp;&nbsp;&nbsp;&nbsp;hi   hi </span>

虽然   的目的。

更合适的选择是使用 pre 标记。

片段：

<html>
    <body>
           hi   hi    
           <br>
           <span><pre>          </pre>hi   hi   </span>
    </body>
</html>

空间不在span标签中呈现

3 个答案:

完整示例