移动端 1px线 & 一个 bug

bug

在 ios 中, input 输入唤醒键盘的时候, 固定顶部的元素 fixed 属性失效

1. 通过绝对定位模拟固定定位
   将需要滚动的元素全部放进一个标签里面, 让需要滚动的元素在这个标签里面滚动, 整个页面不会滚动.
   -webkit-overflow-scrolling: touch; 给滚动的元素设置这个属性让滚动变得流畅一些

2. 事件

1px 的问题

伪类 + transform 解决方案

    e{
        position: relative;
    }
    e::after {
        content: '',
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 1px;
        background: #000;
        transform-origin: 0 0;
        transform: scaleY(0.5)
    }

4 边框解决方案

    e{
        position: relative;
    }
    e::after {
        content: '',
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        border: 1px solid #000;
        transform-origin: 0 0;
        transform: scaleY(0.5)
    }

未完...