元素使用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. MyISAM Static 和 MyISAM Dynamic 有什么区别?

    在 MyISAM Static 上的所有字段有固定宽度.动态 MyISAM 表将具有像 TEXT, BLOB 等字段,以适应不同长度的数据类型. MyISAM Static 在受损情况下更容易恢复.

  2. SPI简单解析

    什么是SPI  一种服务加载方式,全名为Service Provider Interface,Service提供者接口 如果我们要抽象里面的模块,在面对对象编程当中,我们模块之间,一般推荐模块之间基于 ...

  3. MySQL_fetch_array 和 MySQL_fetch_object 的区别是什么?

    以下是 MySQL_fetch_array 和 MySQL_fetch_object 的区别: MySQL_fetch_array() – 将结果行作为关联数组或来自数据库的常规数组返回. MySQL ...

  4. mac-变量

    去除每次都要source : 加入:

  5. three设置相机面向模型

    模型自身position属性 为(0,0,0),但并不在场景中心, 可能建模的原因,位置放到中心但设置了偏移(不一定). 解决方法: 主要代码 let box = new THREE.Box3(); ...

  6. vim recording的使用方法

    使用vim时无意间触碰到q键,左下角出现"recording"这个标识,觉得好奇,遂在网上查了一下,然后这是vim的一个强大功能.他可以录 制一个宏(Macro),在开始记录后,会 ...

  7. Python 与 C++ 向量

    Python 与 C++ 向量 Python 和 C++ 对比 我们再回到向量!你已经学习了如何声明一个空的向量. 在下面的代码中,你可以比较 Python 列表和 C++ 向量的语法.你会看到,C+ ...

  8. 从零开始:微信小程序新手入门宝典《一》

    为了方便大家了解并入门微信小程序,我将一些可能会需要的知识,列在这里,让大家方便的从零开始学习: 一:微信小程序的特点 张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使 ...

  9. 前端react+redux+koa写的博客推荐

    React-Node搭建的博客 曾经用的php+mysql+js写的博客,现在看来已经很low了,所以用目前最火的react+koa框架重构一下.先上地址吧:目前线上版本http://www.liuw ...

  10. C#委托、多播委托极简案例,一看就懂

    废话不多讲,直接上代码,看完代码再讲解: class Class1 { public delegate void Del();//声明委托 public static void F1() { Cons ...