html行间距怎么设置

Posted 2023-05-08

1、首先打开vscode，随便创建一个H5页面，准备用于之后的演示

2、在页面中添加一个div，然后设置宽度为300

3、从浏览器打开这个页面，可以看到现在的行间距，如图所示

4、如果想要将行间距增大，那么可以在div标签中的style属性中添加line-height属性值

5、在浏览器中打开页面，此时就可以看到文字行间距变大了

参考技术A

1、打开vscode，创建一个H5规范的页面，用于演示html行间距的设置方式。

2、在页面中添加一个div，设置宽度为300，目的是为了让div中的文字换行，从而设置行高

3、在浏览器中打开页面，可以看到默认的文字间距，如图所示

4、如果想要将行间距增大，那么可以在div标签中的style属性中添加line-height属性值

5、在浏览器中打开页面，此时就可以看到文字间距变大了

参考技术B

有两种理解：

行内的间距：

<div style="line-height:30px"></div>

行和行之间的间距：

<iamg>
    <page>
        <content>
            <row><label>第一行</label></row>
            <row style="margin-top:10"><label>第二行</label></row>
        </content>
    </page>
</iamg>

本回答被提问者采纳 参考技术C line-height: 1px;这个是针对文本自动换行的，你上面都用<p>标签包含起来了，自然就看不出效果，你把一个<p>标签里面输入很多的文字就能看出效果，如果还不对，贴安装代码来看 参考技术D <span style="line-height:18px;">HTML语言中文<br>本文字的行距</span><br><br>
<span style="line-height:40px;">HTML语言中文<br>本文字的行距</span>

QLabel设置行间距（使用html的语法，比较巧妙）

1、设置行间距

QLabel没有设置行间距的函数，所以这种办法是行不通的。只能采用其它类似的方法来实现，例如设置行高，使用样式代码如下：

<p style=‘line-height:18px‘>推荐</p>

 

2、链接文本

实现点击Label，即可打开网页，且文本没有下划线效果，如下：

<a href="http://www.sina.com"><span style="text-decoration: none; color:#ff0000">新浪</style></a>

text-decoration: none，表示没有文本修饰，下划线就没有了。

 

http://blog.csdn.net/itjobtxq/article/details/9288787