• 技术文章 >Web开发 >css教程

    css line-height属性是什么

    小妮浅浅小妮浅浅2021-07-21 10:04:46原创6355

    概念

    1、css line-height属性会影响行框的布局,用于设定行与行之间的距离(行高),不允许使用负值。

    2、当应用于块级元素时,它定义了基线之间的最小距离,而非距离。

    line-height和font-size的计算值之差(在CSS中成为行间距)分为两半,分别增加到文本行内容的顶部和底部。包含这些内容的最小框是行框。

    cssline-height属性值

    normal:设置合理的行距和默认值。

    number:设置数字,这个数字会乘以当前字体大小来设置行距。

    length:设置固定行距。

    %:基于当前字体大小的百分比行距。

    inherit:规定line-height属性值应由父元素继承。

    注意:所有浏览器都支持line-height属性。

    实例

    <html>
    <head>
        <title>
            行间距
        </title>
        <style type="text/css">
            p.one {
                font-size: 10pt;
                line-height: 8pt;
            }
     
            p.second { font-size: 18px; }
     
            p.third { font-size: 10px; }
     
            p.second, p.third { line-height: 1.5em; }
        </style>
    </head>
     
    <body>
    <p>9月23日是“秋分”,我国古籍《春秋繁露、阴阳出入上下篇》中说:“秋分者,阴阳相半也,故昼夜均而寒暑平。”“秋分”的意思有二:一是太阳在这时到达黄径180.一天24小时昼夜均分,各12小时;二是按我国古代以立春、立夏、立秋、立冬为四季开始的季节划分法,秋分日居秋季90天之中,平分了秋季。</p>
    <p>秋分时节,我国常见流域及其以北的广大地区,均夏侯进入了秋季,日平均气温都降到了22℃以下。北方冷气团开始具有一定的势力,大部分地区雨季刚刚结束,凉风习习,碧空万里,风和日丽,秋高气爽,丹桂飘香,蟹肥橘黄,秋分是美好宜人的时节。</p>
    <p>秋季降温快的特点,使得秋收、秋耕、秋种的“三秋”大忙显得格外紧张。秋分棉花吐絮,烟叶也由绿变黄,正是收获的大好时机。华北地区已开始播种冬麦,长江流域及南部广大地区正忙着晚稻的收割,抢晴耕翻土地,准备油菜播种。</p>
    </body>
    </html>

    以上就是css line-height属性的介绍,希望对大家有所帮助。更多css学习指路:css教程

    本文教程操作环境:windows7系统、css3版,DELL G3电脑。

    专题推荐:css line-height
    品易云
    上一篇:css如何使用scale()方法进行缩放 下一篇:css设置行间距的三种方法

    相关文章推荐

    • css旋转属性如何理解• css设置文字居中的两种方法• css中删除input输入框的阴影• css中margin是什么?怎么设置?• css3中设置元素宽度的方法• CSS鼠标跟随的原理• css中svg图片无法显示怎么办?• css点击元素变更颜色的方法• css如何使用scale()方法进行缩放

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网