行高和字号

行高

CSS中,所有的行,都有行高。盒模型的padding,绝对不是直接作用在文字上的,而是作用在“行”上的。

line-height: 40px;

文字,是在自己的行里面居中的。比如,现在文字字号14px,行高是24px。那么:

为了严格保证字在行里面居中,我们的工程师有一个约定: 行高、字号,一般都是偶数。这样,它们的差,就是偶数,就能够被2整除。

单行文本垂直居中



需要注意的是,这个小技巧,行高=盒子高。 只适用于单行文本垂直居中!!不适用于多行。

如果想让多行文本垂直居中,需要设置盒子的padding:

下面是多行文字垂直居中的算法

字体设置

font属性能够将font-size、line-height、font-family合三为一:

font:12px/30px  "Times New Roman","Microsoft YaHei","SimSun";

行高可以用百分比,表示字号的百分之多少。一般来说,都是大于100%的,因为行高一定要大于字号。

font:12px/200% “宋体”  等价于
font:12px/24px “宋体”;

[css]单/多行居中&字体设置的更多相关文章

  1. css之多行居中

    需求: 单行到多行文字居中. <div> <p>应该为数组中的每个子代分配一个唯一的键.表格dataSource和中的值columns应遵循此规则.默认情况下</p> ...

  2. css单双行样式

    #random_box li:nth-child(odd) {//双行 background: #fff5c4; } #random_box li:nth-child(even) {//单行 back ...

  3. CSS之背景设置、字体设置、文本设置

    <html> <head> <meta charset="utf-8"> <title>单行文本框与多行文本框</title& ...

  4. C# 控制台程序(命令行程序)设置字体颜色,窗口宽高,光标行数

    控制台程序(命令行程序)设置窗口宽度高度,如下代码: Console.WriteLine(Console.WindowHeight); Console.WriteLine(Console.Buffer ...

  5. css 字间距离_css 字体字符间距设置

    介绍下css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div ...

  6. css字体设置

    css字体设置 .selector{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,S ...

  7. Qt实现表格控件-支持多级列表头、多级行表头、单元格合并、字体设置等

    目录 一.概述 二.效果展示 三.定制表头 1.重写数据源 2.重写QHeaderView 四.设置属性 五.相关文章 原文链接:Qt实现表格控件-支持多级列表头.多级行表头.单元格合并.字体设置等 ...

  8. js改变,设置table单双行颜色,jquery改变,设置table单双行颜色

    1.js实现单双行以不同颜色显示 $(document).ready(function () { var color = "#ffeab3"; $("#GvList tr ...

  9. android TextView字体设置最少占多少行. 及其 Java String 字符串操作 . .

    ①  字体设置: 修改代码 :  GridViewActivity.java priceTv为 TextView priceTv.setMaxLines(3); //当多与7个字fu的时候 , 其余字 ...

随机推荐

  1. C语言对文件的操作函数用法详解1

    在ANSIC中,对文件的操作分为两种方式,即: 流式文件操作 I/O文件操作 一.流式文件操作 这种方式的文件操作有一个重要的结构FILE,FILE在stdio.h中定义如下: typedef str ...

  2. PHP入门1

    php是服务器端脚本语言,免费,跨平台,全称是英文Hypertext Preprocessor 一.语法规则 PHP代码写在<?php ?>标签之间, 所有用户定义的函数.类和关键词(例如 ...

  3. xampp更改网站存放目录

    改完后重启xampp 如何更改监听端口8080

  4. JBPM4.4_管理流程定义

    1. 管理流程定义 没有更新功能 1.1. 部署流程定义 注意区分Deployment与ProcessDefinition 1.1.1. 示例代码1:流程定义有关文件在classpath中 Strin ...

  5. php检测文件只读、可写、可执行权限

    例子:检测文件是否可读.可写.可执行. 复制代码代码示例: <?php  $myfile = "./test.txt"; if (is_readable ($myfile)) ...

  6. lua中类的实现原理和实践

    一.基础概念  Lua 本身是函数式的语言,但借助 metatable (元表)这个强大的工具,Lua 实现操作符重载易如反掌.. 下文将详细的解释在Lua中实现类的原理,涉及到的细节点将拆分出来讲, ...

  7. [译]Facebook广告基础--数字广告指南

    广告商指南 原文链接:https://www.facebook.com/business/help/337584869654348/ Ads Help - Desktop > Learn Abo ...

  8. api静态化预案

    1.之前听到api静态化预案,一直以为是前端发送api请求,如果api请求失败,则再次发送一条请求,去请求备份的静态资源. 2.前两天了解到的api静态化预案是这样的:在请求api时,给api请求加上 ...

  9. [UML]UML 教程 - 第二部分

    UML作为软件开发典型的开发过程 业务过程模型创建 业务过程模型被用来定义发生在企业或组织内部的高级业务活动和业务过程,并且是建立用例模型的基础.一般来说业务过程模型比一个软件系统所能实现的更多(比如 ...

  10. CentOS中用户不在 sudoers 文件中。此事将被报告。

    首先切换为root用户 su root; 然后更改etc/sudoers文件的只读为可读可写可执行. sudo chmod 777 /etc/sudoers 输入visudo命令即可编辑文件,找到ro ...