Html 基础知识 - 在同一行与不同行中编写的控件
为什么这两段代码的渲染方式不同？
<button>text1</button> <button>text2</button>
与
<button>text1</button><button>text2</button>
编辑澄清：
我们可以在这个 Fiddle中看到：
在不同的行中写入控件会在它们之间添加空白（控制台检查无法到达该空白，但可以清楚地看到）
在同一行中写入控件则不会。
慕哥9229398浏览 113回答 2
2回答
-
吃鸡游戏
这是因为浏览器除了特殊情况（例如标签）之外没有换行符或制表符的概念，<pre>因此无论何时找到它们，它都会将它们转换为空格。请记住，它将忽略除第一个之外的所有空格、换行符和制表符。您的代码中可以有 30 个连续换行符和 100 个空格，但在浏览器中它将呈现为 1 个空格。即使只有换行符但没有空格或缩进的代码在渲染时仍会显示空格。示例：带有换行符但没有空格的代码： <button>text1</button> <button>text2</button>由于换行，它仍然会在它们之间呈现 1 个空白字符。您可以在小提琴中验证这一点。通常，像这样的任何类型的格式都是由 CSS 处理的。 -
catspeake
HTML 中的“EOL”你必须告诉它，尝试放在<br>按钮之间。<html> <head> <title>Page Title</title> </head> <body> <h1>Case 1</h1> <button>text1</button> <br> <button>text2</button> <h1>Case 2</h1> <button>text1</button> <br> <button>text2</button> </body></html>
随时随地看视频慕课网APP
相关分类
Html5