zoukankan      html  css  js  c++  java
  • CSS进阶(六) line-height

    字母x的下边缘就是我们的基线

    x-height就是小写字母x的高度

    vertical-align:middle中的middle指的是基线网上1/2x-height的高度

    ex单位

    1ex就是一个x的高度。给图标设置1ex就可以让小图标和文本对齐且居中

    line-height

    对于非替换元素的纯内联元素,其高度完全由line-height决定

    字符的行距=line-height - font-size

    误区

    (1)设置单行文字的垂直居中只需要设置line-height属性,不需要设置height

    (2)line-height可以让单行或者是多行元素近似垂直居中,需要配合vertical-align来实现垂直居中

    line-height深入理解

    实际开发过程中,line-height的默认值为normal,且normal是一个变量,根据font-family来确定,在各个浏览器的表现也不一样,因此有必要重置line-height的默认值

    博客性质的网页推荐line-height:1.6-1.8 

    布局结构的网页推荐line-height:20px 或:line-height:1.42585

  • 相关阅读:
    三 zookeeper集群搭建
    一 linux 基本操作
    linux x64 安装 node
    docker nginx/1.7.4
    搭建Portainer可视化界面
    Swarm搭建 Docker集群
    在 Centos7.4上安装docker
    js 处理json对象数据
    生产者消费者模式及其存在的问题
    多线程
  • 原文地址:https://www.cnblogs.com/goOtter/p/9786201.html
Copyright © 2011-2022 走看看