在ios系统上1px的边框会变成2px,ui会感觉很粗

列表间隔,只需要一条边框

.border:after {

  position: absolute; 

  content: '';

  width: 100%;

  left: 0;

  bottom: 0;

  height: 1px;

  background-color: #e3e5e9;

  -webkit-transform: scale(1, 0.5);

  transform: scale(1, 0.5);

  -webkit-transform-origin: center bottom;

  transform-origin: center bottom;

}

通过缩放来兼容iso机

我们时常会遇到另外一种情况,就是页面中的小tag 四边boder

.border::before {
content: '';
position: absolute;
width: 200%;
height: 200%;
border: 1px solid #eee;
transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
transform: scale(0.5, 0.5);
-webkit-transform: scale(0.5, 0.5);
box-sizing: border-box;
}

通过整体缩放来进行兼容

小程序1px边框在苹果机上变粗问题的更多相关文章

  1. 微信小程序禁止刷新之后苹果端还可以下拉的问题

    一.问题描述 最近在做一个小程序项目,需要禁止下拉刷新,于是在page.json里面添加了这段话 "enablePullDownRefresh":false 全局关闭下拉刷新,这段 ...

  2. 用小程序做一个类似于苹果AssistiveTouch功能

    一.首先我先介绍一下,我们要做一个什么样的项目功能 项目功能就是一个音频点击播放,当点击为播放的状态时,一个音频的动图出现,而且是可以跟随着手指的滑动而滑动,而且,在滑动动图的时候,当前下的页面是不可 ...

  3. 微信小程序的z-index在苹果ios无效

    1.在微信开发者工具可以正常显示 2.在安卓真机手机可以正常显示 3.在ios手机真机无法正常显示 原因:父级view的css属性有 position: fixed; ,把它注释掉即可

  4. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  5. 微信小程序 drawImage 问题

    好久没写了,其实可写的还是挺多,主要还是懒吧... 最近公司项目使用小程序做序列帧动画,大概有 116 张图,共9.6M. 比较闲的日子里实验了一番,主要有以下几种方法, 1. css backgro ...

  6. 实时视频直播客户端技术盘点:Native、HTML5、WebRTC、微信小程序

    1.前言 2017 年 12 月,微信小程序向开发者开放了实时音视频能力,给业内带来广阔的想象空间.连麦互动视频直播技术在 2016 年直播风口中成为视频直播的标配,然而只有在原生的 APP 上才能保 ...

  7. 微信小程序开发教程

    9月21日晚发布的微信公众平台·小程序内侧邀请,微信应用号(小程序,「应用号」的新称呼)终于来了!目前还处于内测阶段,微信只邀请了部分企业参与封测.想必大家都关心应用号的最终形态到底是什么样子? 怎样 ...

  8. 微信小程序实战笔记

    前言: 微信小程序最近刚从鹅厂生产出来,我有幸参与了一次小程序的实战,有必要记录我的开发过程.看上去小程序很简单,但是在深入开发的时候才能具体体会里面的变化,接下来记录我的第一个微信小程序的点点滴滴! ...

  9. 微信小程序内测申请

    想申请微信小程序的内测?别做梦了! 小程序内测是邀请制的,目前就发放了200个内测邀请.正因为稀缺,江湖传言内测资格已经炒到300万(一套房)一个了 但是!!!!你可以先熟悉一下相关资料和文档,下载一 ...

随机推荐

  1. 这些Python库真的很“冷”,但是却很强大

    Python是一种很棒的编程语言.事实上,它还是世界上发展最快的编程语言之一.它一次又一次证明了它在数据科学职位中的实用性.整个Python及其库的生态系统使其成为全世界用户(初学者和高级)的合适选择 ...

  2. Java编程基础——运算符和进制

    Java编程基础——运算符和进制 摘要:本文主要介绍运算符和进制的基本知识. 说明 分类 Java语言支持如下运算符: ◆ 算术运算符:++,--,+,-,*,/,%. ◆ 赋值运算符:=,+=,-= ...

  3. Java生鲜电商平台-销售管理设计与架构

    Java生鲜电商平台-销售管理设计与架构 说明:在Java开源生鲜电商平台中,销售人员我们称为跟餐饮店老板沟通与下载APP的一类地推人员.(所谓地推指的就是一个一个上门拜访.) 由于销售人员有以下几类 ...

  4. C#解析JSON数组

    方式一 第一步:使用前,需下载:Newtonsoft.Json.dll 没有的,请到我百度云盘下载 链接:https://pan.baidu.com/s/1JBkee4qhtW7XOyYFiGOL2Q ...

  5. 高性能TcpServer(C#) - 5.客户端管理

    高性能TcpServer(C#) - 1.网络通信协议 高性能TcpServer(C#) - 2.创建高性能Socket服务器SocketAsyncEventArgs的实现(IOCP) 高性能TcpS ...

  6. leetcode之求众数

    求众数 给定一个大小为 n 的数组,找到其中的众数. 你可以假设数组是非空的,并且给定的数组总是存在众数. 示例 1: 输入: [3,2,3] 输出: 3 示例 2: 输入: [2,2,1,1,1,2 ...

  7. 模块 time,datetime,random,typing,hashlib,requests,re

    目录 包 什么是包 为什么要包 1. 包的介绍 2. 绝对导入和相对导入 - 绝对导入 - 相对导入 time模块 时间戳 格式化时间 结构化时间 sleep datetime模块 random模块 ...

  8. RIP路由协议:基础设置/通信练习/兼容问题

    RIP工作原理 首先路由器学习到直连网段 路由器开始运行RIP,当路由器的更新周期30秒到了的时候,会向邻居发送路由表 Metric:度量值,衡量一条路由好坏的值.发送路由表时Metric值会加1 学 ...

  9. SSI注入--嵌入HTML页面中的指令,类似jsp、asp对现有HTML页面增加动态生成内容,见后面例子

    SSI注入漏洞总结 from:https://www.mi1k7ea.com/2019/09/28/SSI%E6%B3%A8%E5%85%A5%E6%BC%8F%E6%B4%9E%E6%80%BB%E ...

  10. 201871010104-陈园园《面向对象程序设计(java)》第十六周学习总结

    201871010104-陈园园<面向对象程序设计(java)>第十六周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ ...