CSS中line-height属性的使用有何影响,哪些事项要注意
Admin 2022-08-01 群英技术资讯 572 次浏览
概念
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>
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
很多朋友对于CSS优先级不是很理解,其实我们能从值相加和bit位存储这两种方式来看,下文的介绍很详细,有需要的有需要的朋友可以了解看看,对大家理解CSS优先级会有一定的帮助。
本篇文章带大家了解一下CSS3 clip-path(裁剪路径),介绍一下如何利用 clip-path 实现动态区域裁剪,希望对大家有所帮助!
css3定义渐变语法的是什么CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前,你必须使用图像来实现这些效果。但是,通过使用 CSS3 渐变(gradients),你
在css中,可以利用“:nth-child(n)”选择器来选择第三个li元素,该选择器的作用就是选择父元素下的第n个子元素,当选择器中的数字为3时,会选择第3个元素,语法为“li:nth-child(3){css样式代码;}”。
前几天被人问,「如何把元素固定在容器底部」。(本来想直接把 demo 地址给他,结果没找到,那么今天我们来补一下)Demo 地址想法&思路如果是页面底部,我们可以直接 position: fixed;b
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008