line-height属性遇到的问题

最近在学习html+css基础，这两天在编写页面的时候，发现有时候使用line-height属性，会变成行间距变的很大的情况，在这里写下总结，由于电脑系统过于low，有些图片就稍后在附加，进入正题：

情况一：

当在一个块中，有一行文字，想要它垂直居中的话，使用我们平常的写法：

line-height：20px;就可以达到想要的效果；

情况二：

在一个块中，如果是多行文字的话，这个时候在使用情况一的方式，好像并

不能达到我们想要的效果，这个时候，我们只需要改变一下取值的方式为百分比

就可以，写法如：

line-height:150%;

【注】前端小白菜，只是想做下笔记提醒一下自己，避免在出现这种错误！！

时间： 2025-01-01 20:50:37

line-height属性遇到的问题的相关文章

深入了解css的行高Line Height属性

来源:http://www.cnblogs.com/fengzheng126/archive/2012/05/18/2507632.html 什么是行间距? 古时候我们使用印刷机来出来文字.印刷出来的每个字,都位于独立的一个块中. 行间距,即传说中控制两行文字垂直距离的东东.在CSS中,line-height被用来控制行与行之间垂直距离. 不过,行间距与半行间距,还是取决于CSS中的line-height.那么,如何来使用line-height呢? 默认状态,浏览器使用1.0-1.2 line-

line height 与 vertical align

一.line height 其中代表inline box(包含上下间距,若height==line-height,则行间距=line-height - font-size/2),big代表content area. 注: 若line-height < content area ,则line box要取line-height的值,这也是为什么会重叠的原因. line-height属性取值: 1. % 若自身没有设置line-height,则line-height = 父元素的font-size *

25．按要求编写一个Java应用程序： （1）编写一个矩形类Rect，包含： 两个属性：矩形的宽width；矩形的高height。 两个构造方法： 1．一个带有两个参数的构造方法，用于将width和height属性初化； 2．一个不带参数的构造方法，将矩形初始化为宽和高都为10。 两个方法： 求矩形面积的方法area() 求矩形周长的方法perimeter() （2）通过继承Rect类编写一个具有

package zhongqiuzuoye; public class Rect { public double width; public double height; Rect(double width,double height) //带有两个参数的构造方法,用于将width和height属性初化; { this.width=width; this.height=height; } Rect() //不带参数的构造方法,将矩形初始化为宽和高都为10. { width=10; height=

按要求编写一个Java应用程序： （1）编写一个矩形类Rect，包含： 两个属性：矩形的宽width；矩形的高height。 两个构造方法： 1．一个带有两个参数的构造方法，用于将width和height属性初化； 2．一个不带参数的构造方法，将矩形初始化为宽和高都为10。 两个方法： 求矩形面积的方法area() 求矩形周长的方法perimeter() （2）通过继承Rect类编写一个具有确定位

package com.hanqi.test; public class Rect { public double width; public double height; //创建有参构造方法 Rect(double width,double height) { this.width=width; this.height=height; } //创建无参构造方法 Rect() { } //构建成员方法,获取周长和面积 public double getZhouchang() { return

通过继承Rect类编写一个具有确定位置的矩形类PlainRect，其确定位置用 矩形的左上角坐标来标识，包含： 添加两个属性：矩形左上角坐标startX和startY。 两个构造方法： 带4个参数的构造方法，用于对startX、startY、width和height属性 初始化； 不带参数的构造方法，将矩形初始化为左上角坐标、长和宽都为0 的矩形； 添加一个方法： 判断某个点是否在矩形内部的方法

package b; public class Rect { Double width; Double height; public Double getWidth() { return width; } public void setWidth(Double width) { this.width = width; } public Double getHeight() { return height; } public void setHeight(Double height) { this

line-height系列——定义和工作原理总结

一.line-height的定义和工作原理总结 line-height的属性值: normal    默认  设置合理的行间距. number  设置数字,此数字会与当前的字体尺寸相乘来设置行间距line-height:1.5; length    设置固定的行间距.  例如:line-height:18px; %          基于当前字体尺寸的百分比行间距. 例如:line-height:150%; line-height 的定义: 首先认识下文字的四条线 从上到下四条线分别是顶线.中线

CSS(三)：基本属性

1.属性选择器 E[att]:选择具有att属性的E元素. 1 /* 获取具有class属性的p元素 */ 2 p[class]{ 3 color: red; 4 } 5 6 <p class="a">class:a</p> E[att="val"]:选择具有att属性且属性值等于val的E元素. 1 /* 获取class属性的值为"a"的p元素 */ 2 p[class="a"]{ 3 color:

浅谈line-height

基础知识 有4种模型,分别是 块,块盒模型 containing boxing,包括line 行内盒模型 inline boxing ,包含content 行模型 line boxing,包含inline,line高度是由最高的inline元素决定. 内容区域 content area 这部分内容可以着重看 这里有详细的介绍. line-height与line boxes高度 由上面的内容可以总结出line boxes 的高度取决与其下属的inline boxes 中最高的元素. 对于像inpu

[扩展]为UIView扩展x,y,width,height,centerX,centerY,Size,Origin等属性

大家应该知道如何设置一个view组件的位置把,是的,如下: view.frame=CGRectMake(x,y,width,height);//设置组件的x,y坐标,设置组件的宽度高度... 如果我单独要设置坐标或者宽度高度,得这样: view.frame.size.width=100; view.frame.size.height=100; 如果你想偷个懒,比如: view.frame.size=(CGSize){200,200};//这个语句会报错,因为无法对size赋值 通过上面的代码,大

富文本中的段落属性

// NSParagraphStyleAttributeName 段落的风格(设置首行,行间距,对齐方式什么的)看自己需要什么属性,写什么 NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init]; paragraphStyle.lineSpacing = 10;// 字体的行间距 paragraphStyle.firstLineHeadIndent = 20.0f;//首行缩进 paragr