如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
标签无盒模型,不产生间距,行间距离完全由父元素line-height决定;调节换行间距应修改line-height、margin等上下文样式,而非br本身。

br 标签本身没有“换行间距”,只有 line-height 起作用
很多人以为 <br> 会自带高度或间距,其实它只是一个空节点,不生成盒模型,margin、padding、height 全部无效。你看到的两行之间的距离,100% 来自父元素的 line-height 值。
比如:<p style="font-size:16px; line-height:2">第一行<br>第二行</p>,实际行高是 32px(16×2),<br> 只是触发换行,不增加额外空间。
-
line-height是无单位数值(如1.6)时,按字体大小倍数计算,嵌套时继承可靠 - 用
px固定值(如line-height: 32px)容易在子元素字体变大时导致行高塌陷 - 给
<br>单独加样式(如style="margin-bottom:10px")完全无效——它没盒模型
想调换行后空隙?别碰
,改 margin 或 line-height
如果你希望“第一行”和“第二行”之间空得更多,<br> 不是调节对象。真正该动的是:
- 父容器的
line-height:影响所有行内换行,统一且语义合理 - 后续块级元素的
margin-top:比如第二行文字包在<span></span>里,给它设margin-top - 整个段落的
margin-bottom:适用于段落间间距,比堆<br>更可控
错误做法:<p>地址第一行<br><br><br>地址第三行</p> —— 这会让可访问性工具无法识别逻辑结构,打印时也易错位。
br 和 p 的换行逻辑完全不同,混用会破坏语义
<br> 是行内断点,<p></p> 是语义段落。浏览器默认给 <p></p> 加上下 margin(约 1em),看起来有“空行”,但这和 <br> 毫无关系。
- 写地址、诗歌等同一语义块内的多行内容,才用
<br> - 正文、条款、说明文字必须用
<p></p>,否则屏幕阅读器读不出段落边界 - CMS 富文本编辑器常把回车转成
<br>,而不是<p></p>,这是常见源头问题
一个典型反例:<p>第一段</p>
<br><p>第二段</p> —— 中间那个 <br> 不仅多余,还可能被解析为不可见字符,干扰无障碍读取。
响应式场景下,br 标签极易失效
在小屏设备上,文字自动折行,<br> 强制换行的位置可能完全错乱。比如诗歌在桌面端每行 4 字,手机上变成每行 2 字,再用 <br> 就会把本该连贯的句子切成碎片。
- 用 CSS
white-space: pre-line配合<div> 更可控 <li>地址类内容可用 Flex 布局 + <code>flex-direction: column替代一堆<br> - 真需要保留换行语义(如歌词),优先用
<pre class="brush:php;toolbar:false;"></pre>或服务端预处理换行符
最常被忽略的一点:你调的不是 <br>,而是它所处上下文的排版规则。盯着标签本身改,永远解决不了问题。










