需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。
2、在index.html中的<body>标签中，将外层的table改为div，新增css代码：div {width: 300px} table {float: left}。
3、浏览器运行index.html页面，此时表格们实现了每3个自动换行。
“br”作为英文是“barter rabbet”的缩写，有“换行”的意思。在html中作为标签也是起到换行的作用，我们一起来看看它的具体用法吧！
一、<br>标签定义及用法
在html中，<br>标签是使用来插入一个换行符，它是一个空标签（没有元素内容），有的人还叫它单标签（没有结束标签）。
<br>标签有三种写法都不会报错，即<br>、</br>、<br/>这三种写法。在xhtml中，像<br>类似的单标签都需要使用“/”来自身关闭，如：<br/>，是没有</br>这样的写法的，但是在html中这样写也是不会报错的。虽然这三种写法都可以，但是建议写成<br>或者<br/>更严谨。
如果是在xhtml中就必须写成<br/>或者<br></br>。
二、语法格式
<br>或者<br/>
说明：<br>标签的作用就是在该处插入换行符，该标签后的内容将从下一行开始。
三、实例
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>html<br>标签换行符详细介绍</title></head><body bgcolor="burlywood"><p>我是一个段落。<br>我是一个段落。<br/>我是一个段落。</p></body></html>
运行结果：
关于<br>标签比较简单，在这就不过多的介绍了。
html语言当中，<p>标签 或者是<br/>都可以实现table表格内换行。也可以使用css来实现，CSS控制Table单元格强制换行与强制不换行 。
用CSS实现Table单元格数据自动换行或不换行的实现方法如下：
1、强制换行：
1
2
3
4
5
6
7
8
9
10
11
<style type="text/css">
.AutoNewline
{
Word-break: break-all/*必须*/
}
</style>
<table>
<tr>
<td class="AutoNewline">自动换行</td>
</tr>
</table>
2、强制不换行：
1
2
3
4
5
6
7
8
9
10
11
<style type="text/css">
.NoNewline
{
word-break: keep-all/*必须*/
}
</style>
<table>
<tr>
<td class="NoNewline">不换行</td>
</tr>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）