HTML中的<br>标签用于在文本中插入一个换行符，当你想要在HTML文档中创建一个新的段落或者将文本分成多个部分时，可以使用<br>标签，下面我们详细介绍如何使用<br>标签。
1. 在HTML文档中插入<br>标签
要在HTML文档中插入<br>标签，只需将其放在你想要换行的位置即可。
这是第一行文字。<br> 这是第二行文字。
上述代码将在两行文字之间插入一个换行符。
2. <br>标签的属性
<br>标签本身没有属性，但你可以在其他标签中使用它，如<p>, <div>, <li>等，这将使得这些标签内的文本在浏览器中自动换行。
<p>这是一段文字。</p><br> 这是另一段文字。
这段代码将在两个段落之间插入一个换行符。
3. <br clear="both" />属性
有时，你可能希望在插入换行符后清除浮动，这时，可以使用<br clear="both" />属性，将此属性添加到<br>标签后，浏览器会在换行后清除之前元素的浮动效果。
<!DOCTYPE html>
<html>
<head>
<style>
.float-left { float: left; width: 50%; background-color: lightblue; }
.float-right { float: right; width: 50%; background-color: lightgreen; }
</style>
</head>
<body>
<div class="float-left">左边的内容</div>
<div class="float-right">右边的内容</div>
<br clear="both" /> <!-添加此行以清除浮动 -->
</body>
</html>
上述代码中，两个带有浮动样式的<div>元素分别位于页面的左侧和右侧，通过在最后一个<br>标签后添加clear="both",我们可以确保在这两个元素之间插入换行符后，清除它们之间的浮动效果，这样可以避免因浮动引起的布局问题。
4. 与CSS相关的注意事项
当使用<br>标签时，需要注意以下几点：
如果要在一个块级元素内插入一个换行，需要在该元素内添加一个空的元素(如一个空的<span></span>),然后再插入<br>标签，这是因为块级元素不会自动换行，而空元素会触发换行，例如
<div style="width: 200px;">这是一个宽度为200px的块级元素。</div><br /> <!-这里会触发换行 -->
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/223957.html
微信扫一扫 