增加了padding 一定要减去相应的高度，不然整个元素的高度会增高（原高+padding）

line-height：行高

1.行高要比字体大，不然字体会挤到一块去

2.若父盒子没有设置高度，则行高会把父盒子撑开

3.若行高等于父盒子高度，在单行文本情况下，文字会垂直居中显示(text-align:center 加这种方法可以使文字整体居中，在父盒子中央)

4.多行文字居中：padding -top=（盒子高度-行高*行数）/2，然后行高减去padding-top

设了padding要减去盒高 和 line-height 行高的更多相关文章

  1. wpf datagrid row height 行高自动计算使每行行高自适应文本

    wpf 的datagrid的行高 要么是Auto,要么是定值:但会带来麻烦就是每行行高都一样. 当需要按内容(主要是wrap 换行的textbox或textblock)来动态调整行高的时候,需要用到d ...

  2. CSS.03 -- 浏览器行高、字体；盒子模型--边框、内边距、外边距

    如果此时你也在自学中,请使用 FireWorks CS6 进行切图测距等,百度一下吧~ Fireworks的基本使用 新建文件   ctrl+n 打开文件  ctrl+o 调出和隐藏标尺 ctrl+r ...

  3. CSS行高——line-height

    初入前端的时候觉得CSS知道display.position.float就可以在布局上游刃有余了,随着以后工作问题层出不穷,才逐渐了解到CSS并不是几个style属性那么简单,最近看了一些关于行高的知 ...

  4. (转)CSS行高——line-height

    原文地址:http://www.cnblogs.com/dolphinX/p/3236686.html 初入前端的时候觉得CSS知道display.position.float就可以在布局上游刃有余了 ...

  5. 行高：line-height图文解析

    行高——line-height 初入前端的时候觉得CSS知道display.position.float就可以在布局上游刃有余了,随着以后工作问题层出不穷,才逐渐了解到CSS并不是几个style属性那 ...

  6. 行内元素(inline标签)设置了行高为什么不生效，还是表现为父盒子的行高？行内元素行高问题终极解释

    最近在看张鑫旭大佬的<css世界>,读到5.2.4  内联元素 line-height 的“大值特性” ,产生了疑惑, 在开发中确实也遇到了同样的问题,深入探究后得出结果,先说结论吧,论证 ...

  7. HTML连载42-清空默认边距、文字行高

    一.            webstorm取色技巧:webstorm内置了颜色取色器,我们对某种颜色未知的时候,可以利用下图中的取色器,进行颜色识别. 二.系统会默认给body添加外边距,因此我们对 ...

  8. CSS行高——line-height 垂直居中等问题

    CSS行高——line-height   初入前端的时候觉得CSS知道display.position.float就可以在布局上游刃有余了,随着以后工作问题层出不穷,才逐渐了解到CSS并不是几个sty ...

  9. css - 行高

    css - 行高 line-height行高 取值:px | em | rem | 百分比 | 纯数字 | normal | inherit 设置给:块.行内.行内块 应用给:文本 继承:块.行内.被 ...

随机推荐

  1. java连接sql server--关于登录验证及对数据库增删改查应用

    一:步骤## 1.sql server建立数据库和相关表 2.建立数据源  (1).打开控制面板找到管理,打开ODBC选项或直接搜索数据源  (2).打开数据源配置后点击添加,选择sql server ...

  2. Android Studio 分类整理 res/layout 中的布局文件

    •准备工作 新建一个名为 TestLayouts 的项目: 进入 Project 模式: 来到 TestLayouts/app/src/main/res/layout 文件夹下: •分类整理 layo ...

  3. 开源服务器设计总计（plain framework2020年总计）

    2020年注定会被历史铭记,世界遭受着一场前所未有的灾难,这种灾难到现在还在持续.还记得19年末的时候,那时候听到一点点消息,哪里想得到年关难过,灾难来的让人猝不及防.由于疫情防控,2020年感觉转瞬 ...

  4. OO_Unit3_Summary

    JML这一单元是真的有含金量,很有难度.而且这难点和前两单元完全不同,前两单元是容易架构混乱导致细节出问题,JML单元是读不懂JML规格的话架构都构不出来,以及即使能够读懂JML规格了,让自己写规格的 ...

  5. 2018年block3学习计划

    还是要给自己制定一个block的计划,希望自己的技术能有更进一步的提升 1. 算法/数学 随着学习的进一步深入,愈发认识到了算法的重要性,这个block给自己定下的计划就是 1)把introducti ...

  6. pandas（1）：Pandas文件读取——read_excel()

    目录 一.函数原型 二.功能说明 三.常用参数说明 四.总结 一.函数原型 pd.read_excel(io, sheet_name=0, header=0, names=None, index_co ...

  7. 解决Echarts+<el-tab-pane>的警告：Can't get DOM width or height

    1 问题描述 环境: Chrome 87 Element-Plus Vue3.0.5 <el-tab>+<el-tab-pane>中使用Echarts 警告如下: 2 代码 & ...

  8. Go-08-函数与指针

    Go语言的函数本身可以作为值进行传递,既支持匿名函数和闭包,又能满足接口. 函数声明 func 函数名 (参数列表)(返回参数列表){ // 函数体 } func funcName(parameter ...

  9. day13.常用模块

    一.time与datetime模块 1.1time 在Python中,通常有这几种方式来表示时间: 时间戳(timestamp):通常来说,时间戳表示的是从1970年1月1日00:00:00开始按秒计 ...

  10. mysql架构与存储引擎 (Myisam与Innodb)

    mysql抽象架构:可以分为SQL Layer和Storage Engine Layer mysql的engine层是基于表的,不是基于库的,创建表的语句可以指定engine Mysql的架构 Mys ...