V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
paparika
V2EX  ›  前端开发

小程序 boder 死活不够细

  •  
  •   paparika · 2018-03-29 15:36:43 +08:00 · 3220 次点击
    这是一个创建于 2435 天前的主题,其中的信息可能已经有所发展或是发生改变。
    border 死活就是不变细,我试了 1rpx,1px,明显不够细,而且 1rpx 和 1px 看上去没差,另外 border 往大了改是有效果的,建了新的空工程试过也一样
    10 条回复    2018-03-29 17:42:48 +08:00
    hooych
        1
    hooych  
       2018-03-29 16:03:16 +08:00
    试一下下面这个
    ''' 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
        2
    paparika  
    OP
       2018-03-29 16:23:47 +08:00
    @hooych 老铁,能讲解下思路吗,我前端小白的说
    paparika
        3
    paparika  
    OP
       2018-03-29 16:25:32 +08:00
    @hooych 好像明白了点,缩小,放大,这几行起作用
    width: 200%;
    height: 200%;
    transform: scale(0.5);
    transform-origin: 0 0;

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


    想省事可以用 https://github.com/youzan/zanui-weapp
    hooych
        8
    hooych  
       2018-03-29 16:38:27 +08:00
    @algery #7 正解,我还真没搜索过这个问题... https://www.cnblogs.com/lunarorbitx/p/5287309.html
    hooych
        9
    hooych  
       2018-03-29 16:42:27 +08:00
    更正: #6 正解
    paparika
        10
    paparika  
    OP
       2018-03-29 17:42:48 +08:00
    @viko16
    @algery
    @hooych 先谢了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3423 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 11:25 · PVG 19:25 · LAX 03:25 · JFK 06:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.