1、首先看下我们的HTML代码,代码很简单,就是一个form里有二个输入框,一个Checkbox选框,和一个提交按钮。

2、在浏览器里打开,先看下页面显示的效果。

3、默认情况下,CheckBox和文本是在同一行显示的,要让文本换行显示,我们可以添加一些css样式就行了。
如图,我们在 label标签上添加了 style="display: block;"的样式。

4、重新运行页面,可以看到现在的Checkbox文本已经换行显示了。

5、要注意的是,文本和Checkbox的顺序不能反过来,如果文本先写在前面,如图,那显示就不一样了。

6、在浏览器可以看到,文本显示在Checkbox上方了,

7、其实要让文本换行,还有另外一种方法,把Checkbox和label文本都各自放在一个div里面就行了,

8、从浏览器上看,效果一样
