line-height支持属性值

1.normal（默认属性）

跟着用户的浏览器走，且与元素字体关联

normal值 = 字体大小/100

2.<number>

使用数值作为行高值。如：line-height:1.5 根据当前元素的font-size大小计算 line-height = 1.5*20px(font-size) = 30px

3.<length>

使用具体长度值作为行高值

4.<percent>

使用百分比作为行高值

5.inherit（继承）

input框等元素默认行高是normal,使用inherit可以让文本框样式可控性更强

实例1：图片下有间距

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

</head>

<body>

    <div style="background-color: gray">

        <img src="123.jpg" style="width: 300px">

    </div>

    <!-- 引起这个问题的原因是图片后接了行藏文本元素，而默认的vertical-align：baseline

      也就是说图片要对其隐藏文本元素的基线，所以引发了下面间距的问题

      解决的办法有三个：1.img元素display:block

                       2.img元素vertical-align:bottom

                       3.父级div元素line-height:0

    -->

</body>

</html>

line-height各类属性值的更多相关文章

  1. （1-2）line-height的各类属性值

    (1-2)line-height的各类属性值 首先来个疑问!没有问题印象不深嘛 一.line-height支持哪些属性值呢? 五只手指头就能数过来了咯. 比如normal, <number> ...

  2. C# WInForm中 窗体的this.width和this.height的属性值不能大于显示器的最大分辨率

    最近在做一个小项目的时候,发现在 1680x1050 分辨率显示器上写的代码,将窗体的宽度和高度 设置成了 1600×900,在高于1600×900的分辨率上缩放显示很正常, 而后转移到 分辨率低于 ...

  3. css的五种属性值----在路上（21）

    在CSS中,每个属性的属性值都有一定的范围,并且不同类型的属性值有不同的值.对于一个属性,必须取得正确的属性值,才能被浏览器正确地解释,因此一定要弄清每种类型的属性值范围.在CSS中属性一般有以下几种 ...

  4. CSS中隐藏内容的3种方法及属性值

    CSS中隐藏内容的3种方法及属性值 (2011-02-11 13:33:59)   在制作网页时,隐藏内容也是一种比较常用的手法,它的作用一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出 ...

  5. 前台jquery+ajax+json传值，后台处理完后返回json字符串，如何取里面的属性值？（不用springmvc注解）

    一.取属性值 前台页面: function select(id){ alert("hfdfhdfh"+id); $.ajax({ url:"selectByid.jsp& ...

  6. 常见标签的默认属性值及相互作用——关于CSS reset的思考

    在现在的网站设计中使用reset.css用重置整个站点的标签的CSS属性的做法很常见,但有时候我们已经为了reset而reset,我们经常看到这样的reset代码 div{ padding:0px; ...

  7. jquery获取、改变元素属性值

    //标签的属性称作元素属性,在JS里对应的DOM对象的对应属性叫DOM属性.JS里的DOM属性名有时和原元素属性名不同. //==================================操作元 ...

  8. JQuery 操作对象的属性值

    通过JQuery去操作前台对象(div,span...)的属性是很常见的事情,本文就简单的介绍几种操作情形. 1):通过属性值去获取对象 2):用JQuery去修改对象的属性值 3):获取并修改对象的 ...

  9. class属性中为什会添加非样式的属性值？

    来由 在一些插件中经常看到, 在class属性中出现一些跟样式无关的属性值, 这些值在css样式中没有对应定义, 但是在js中会根据这个值来给dom对象添加特殊的行为, 例如: jquery vali ...

随机推荐

  1. Servlet的相关类--ServletConfig（接口）

    ServletConfig是一个接口,有关配置文件的 servlet的配置信息<---对应--->ServletConfig web.xml配置文件会被加载到内存中,然后解析器会对它进行解 ...

  2. tcprstat测试服务器请求响应时间

    tcprstat使用,tcprstat必须使用root权限才能使用 tcprstat -p 3306 -t 1 -n 5 -l 192.168.52.250 centos统计分析所有的IP地址

  3. npm run dev没反应

    npm config set registry https://registry.npm.taobao.org npm install npm run dev

  4. 小程序 滚动wx.pageScrollTo

    API:https://developers.weixin.qq.com/miniprogram/dev/api/wx.pageScrollTo.html wx.pageScrollTo 在小程序的开 ...

  5. JS 变量和函数提升 全局变量和局部变量

    变量提升 1. var a = 10; function test() { a = 100; console.log(a); console.log(this.a); var a; console.l ...

  6. Android编程 控件与布局

    控件和布局的继承结构 常用控件 1.TextView <?xml version="1.0" encoding="utf-8"?> <Line ...

  7. 谷歌AM HTML视频代码amp-video示例

    ntroduction Use amp-video to embed videos into your AMP HTML files. Video source files must be serve ...

  8. Solaris环境下使用snoop命令抓包

    (1)报文抓取 Solaris中自带有snoop抓包工具,通过执行相应的命令抓取. 抓取目的地址为10.8.3.250的数据包,并存放到/opt/cap250的文件里 snoop -o /opt/ca ...

  9. Check SQL Server Deadlock

    Sometimes a script keeps running for a long time and can't stop, then a db blocking is occurring. We ...

  10. python类之魔法方法

    python类之魔法方法: class A(object): def __init__(self,x): self.x = x def __neg__(self): print('-v') def _ ...