Appearance

2024.07.08~2024.07.12

senmu2024/07/12

`<span>` 标签空格、回车问题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <span>hello</span>
    <span>world</span>
    <span>helloworld</span>
</body>
</html>

上述代码中每个 span 标签都会出现一点小间隙，造成这一情况的原因是什么？

span 标签为行内标签(display: inline;)，它们之前或者之后并不会产生换行。在正常的流中，如果有空间，下一个元素将会在同一行上。
回车会被转换成空格

ON THIS PAGE

<span> 标签空格、回车问题