paparika

小程序 boder 死活不够细

  •  
  •   paparika · Mar 29, 2018 · 4047 views
    This topic created in 3145 days ago, the information mentioned may be changed or developed.
    border 死活就是不变细,我试了 1rpx,1px,明显不够细,而且 1rpx 和 1px 看上去没差,另外 border 往大了改是有效果的,建了新的空工程试过也一样
    10 replies  •  2018-03-29 17:42:48 +08:00
    hooych
    hooych
    Mar 29, 2018
    1
    试一下下面这个
    ''' css
    .card::after {
    display: flex;
    box-sizing: border-box;
    align-items: center;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 200%;
    height: 200%;
    transform: scale(0.5);
    transform-origin: 0 0;
    border: 1rpx solid #e5e5e5;
    border-radius: 32rpx;
    pointer-events: none;
    }
    '''
    paparika
    paparika
    OP
    Mar 29, 2018
    2
    @hooych 老铁,能讲解下思路吗,我前端小白的说
    paparika
    paparika
    OP
    Mar 29, 2018
    3
    @hooych 好像明白了点,缩小,放大,这几行起作用
    width: 200%;
    height: 200%;
    transform: scale(0.5);
    transform-origin: 0 0;

    感谢
    paparika
    paparika
    OP
    Mar 29, 2018
    4
    不过本质原因是什么呢?小程序有毒还是我代码有毒还是我 IDE 有毒
    viko16
    viko16
    Mar 29, 2018 via Android
    5
    @paparika 关键点:transform scale 0.5
    ZddPub
    ZddPub
    Mar 29, 2018
    6
    搜索一下 1px 边框问题
    hooych
    hooych
    Mar 29, 2018
    7
    @paparika 你查一下::after,覆盖在 .card 上,宽高放大 200%后设置 border,scale(0.5)后 border 也会 scale;


    想省事可以用 https://github.com/youzan/zanui-weapp
    hooych
    hooych
    Mar 29, 2018
    8
    @algery #7 正解,我还真没搜索过这个问题... https://www.cnblogs.com/lunarorbitx/p/5287309.html
    hooych
    hooych
    Mar 29, 2018
    9
    更正: #6 正解
    paparika
    paparika
    OP
    Mar 29, 2018
    10
    @viko16
    @algery
    @hooych 先谢了
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1571 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 42ms · UTC 04:11 · PVG 12:11 · LAX 20:11 · JFK 23:11
    ♥ Do have faith in what you're doing.