css怎么设置行高


当前第2页 返回上一页

可能的值

说明
normal默认,设置合理的行间距。
number设置数字,此数字会与当前的字体尺寸相乘来设置行间距。相当于倍数
length设置固定的行间距。
%基于当前字体尺寸的百分比行间距。
inherit规定应该从父元素继承 line-height 属性的值。

示例:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

<!DOCTYPE html>

<html>

 

    <head>

        <meta charset="utf-8">

        <style type="text/css">

            p.small {

                line-height: 90%

            }

             

            p.big {

                line-height: 200%

            }

        </style>

    </head>

 

    <body>

 

        <p>

            这是拥有标准行高的段落。 在大多数浏览器中默认行高大约是 110% 到 120%。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。 这是拥有标准行高的段落。

        </p>

 

        <p class="small">

            这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。 这个段落拥有更小的行高。

        </p>

 

        <p class="big">

            这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。 这个段落拥有更大的行高。

        </p>

 

    </body>

 

</html>

效果图:

5.png

更多编程相关知识,请访问:编程视频!!

以上就是css怎么设置行高的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

css class是啥

html中弹性布局(flex)的介绍(附代码)

div css顶部固定不动的实现方法

css怎么实现隐藏并占位

css外联样式不起作用怎么办

css如何让图片自适应屏幕大小

如何使用css解决浮动元素父元素的高度塌陷问题?(代码示例)

css的字体样式如何设置

css实现文本图标对齐的方法

css如何使用计数器给元素自动编号?css计数器的使用(代码示例)

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...