元素使用rem做单位且较小时,对于border-radius:50%在部分浏览器不圆解决方法:
1、将原来宽高扩大至两倍(.1rem --> .2rem),再使用transform:scale(.5);transform-origin: 0% 50%进行缩放。
2、将元素rem单位换位px为单位。

/*方法1*/
.ellipsisDot {
display: inline-block;
width: .2rem;
height: .2rem;
background: #C6C6C6;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
-moz-transform: scale(.5);
-webkit-transform: scale(.5);
transform: scale(.5);
-moz-transform-origin: 0 50%;
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
} /*方法2*/
.ellipsisDot {
display: inline-block;
width: 5px;
height: 5px;
border-radius: 50%;
background: #C6C6C6;
margin-left: 3px;
}

以rem为单位,数值较小,border-radius:50%部分浏览器渲染不圆方法的更多相关文章

  1. 关于 rem 作为单位设置大小

    rem是相对长度单位.相对于根元素(即html元素)font-size计算值的倍数htm{font-size: 62.5%;}根元素(html)先设置一个font-size,一般情况下为了容易计算re ...

  2. 用nodejs把目录下所有用px做单位的css文件转化为用rem做单位的css文件

    20171105 1211/星期日 公司为了更好适配手机端,以前用px做单位的css文件,全部需要转化为用rem做单位,目前是1rem=37.5px;开发新项目时,还是用习惯的px写样式代码,完成UI ...

  3. 移动端适配rem为单位的rem.js及个别设备设置了大字体模式,导致页面变形的处理方式

    这段时间内,涉及到的都是移动端开发,说到移动端开发,我们就会思考到,目前分辨率的问题,如果用px为单位的话,在不同移动设备和不同分辨率下,页面的效果可能会有所不同,甚至导致页面变形.所以在次我们就用到 ...

  4. 小韦系统装工行网银U盾驱动的方法

    小韦系统装工行网银U盾驱动的方法 拷贝文件.bat @echo 开始注册echo n|copy /-y scarddlg.dll %windir%\system32\echo n|copy /-y w ...

  5. 【开源】微信小程序、小游戏以及 Web 通用 Canvas 渲染引擎 - Cax

    Cax 小程序.小游戏以及 Web 通用 Canvas 渲染引擎 Github → https://github.com/dntzhang/cax 点我看看 DEMO 小程序 DEMO 正在审核中敬请 ...

  6. 微信小程序弹出可填写框两种方法

    方法一: html页面: < view class = "container" class = "zn-uploadimg" > < butt ...

  7. 微信小程序开发——以简单易懂的浏览器页面栈理解小程序的页面路由

    前言: 对于小程序的页面路由,如果没有一定开发经验的话,理解起来还是会有些困难的.哪怕是有一定小程序开发经验的开发者,能够完全理解掌握的恐怕也不多. 这里就以另外一种方式来详细的介绍小程序的页面栈及路 ...

  8. 微信小程序:封装全局的promise异步调用方法

    微信小程序:封装全局的promise异步调用方法 一:封装 function POST(url, params) { let promise = new Promise(function (resol ...

  9. JS使用正则表达式获取小括号、中括号及花括号内容的方法示例

    本文实例讲述了JS使用正则表达式获取小括号.中括号及花括号内容的方法.分享给大家供大家参考,具体如下: JS 正则表达式 获取小括号 中括号 花括号内的内容 <!DOCTYPE html> ...

随机推荐

  1. String 和 StringBuilder、StringBuffer 的区别?

    Java 平台提供了两种类型的字符串:String 和 StringBuffer/StringBuilder,它 们可以储存和操作字符串.其中 String 是只读字符串,也就意味着 String 引 ...

  2. django CBV 及其装饰器

    #urls.py from django.contrib import admin from django.urls import path, re_path from app01 import vi ...

  3. 学习k8s(一)

    一.安装及介绍 1.k8s架构 2.核心组件 3.其他组件 4.安装方式 yum安装: 1.5 最简单,版本低,适合学习 二进制安装: 最繁琐,可以用saltstack安装 kubeadm安装: 谷歌 ...

  4. 错误问题之“Apache Log4j 漏洞,在版本为包含2.14以内!”

    漏洞概述 Apache Log4j是一个用于Java的日志记录库,其支持启动远程日志服务器. Log4j 1.2 中包含一个 SocketServer 类,该类容易受到不可信数据反序列化的影响,当侦听 ...

  5. hackgame2018_签到

    hackgame2018_签到 进入题目得到如下提示 尝试提交 发现这个输入框长度做了限制我们将前端js修改一下 然后提交以下这样就发现了flag这题比较简单--

  6. 4.2 ROS节点运行管理launch文件

    4.2 ROS节点运行管理launch文件 关于 launch 文件的使用我们已经不陌生了,在第一章内容中,就曾经介绍到: 一个程序中可能需要启动多个节点,比如:ROS 内置的小乌龟案例,如果要控制乌 ...

  7. Qunee for HTML5 v1.6新版本发布

    Qunee for HTML5 V1.6正式发布,修复了一些 BUG,增加了滚动条支持,改进了编辑器,增加了JSON 导入导出.告警冒泡.连线流动,UI 定制等扩展示例,欢迎 访问 导航面板 增加了滚 ...

  8. 深入解析 float

    0.前言 float属性在css2中是一个热门的属性,被广泛应用于布局之中,同时由于不当使用float带来的问题也非常多,本文结合自己对float的理解以及实际项目中碰到float的相关问题,做一个详 ...

  9. [译] Facebook:我们是如何构建第一个跨平台的 React Native APP

    英文原文(需FQ):https://code.facebook.com/posts/1189117404435352/ 早些时候,我们介绍过iOS版的React Native. React Nativ ...

  10. 7步学会在Windows下上架iOS APP流程

    之前用跨平台开发工具做了一个应用,平台可以同时生成安卓版和苹果版,想着也把这应用上架到App Store试试,于是找同学借了个苹果开发者账号,但没那么简单,还要用到Mac电脑的钥匙串申请发布证书和上传 ...