-webkit-overflow-scrolling

概述

-webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果.

在样式表对应的class里添加属性

值:auto

-webkit-overflow-scrolling: auto;
使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。

值:touch

-webkit-overflow-scrolling: touch;
使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。

常用MIME类型

- 阅读剩余部分 -

方法一 利用 line-height 实现垂直居中

    #example1 {
        height: 100px;
        line-height: 100px;
        background: #161616;
        color: #fff;
        width: 200px;
    }

    <div id="example1">单行文字垂直居中</div>

这种方法适用于单行文本垂直居中,如果文本内容太长，出现了换行，换行后的内容会溢出。

方法二 利用 display: table 实现垂直居中

    #example2 {
        height: 100px;
        background: #161616;
        color: #fff;
        width: 400px;
        overflow: hidden;
        display: table;
    }
    #example2 .inner{
        display: table-cell;
        vertical-align: middle;
        height: 50px;
        background:#999;
    }

    <div id="example2">
        <div class="inner">块区域垂直居中</div>
    </div>

- 阅读剩余部分 -