以rem为单位,数值较小,border-radius:50%部分浏览器渲染不圆方法
元素使用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%部分浏览器渲染不圆方法的更多相关文章
- 关于 rem 作为单位设置大小
rem是相对长度单位.相对于根元素(即html元素)font-size计算值的倍数htm{font-size: 62.5%;}根元素(html)先设置一个font-size,一般情况下为了容易计算re ...
- 用nodejs把目录下所有用px做单位的css文件转化为用rem做单位的css文件
20171105 1211/星期日 公司为了更好适配手机端,以前用px做单位的css文件,全部需要转化为用rem做单位,目前是1rem=37.5px;开发新项目时,还是用习惯的px写样式代码,完成UI ...
- 移动端适配rem为单位的rem.js及个别设备设置了大字体模式,导致页面变形的处理方式
这段时间内,涉及到的都是移动端开发,说到移动端开发,我们就会思考到,目前分辨率的问题,如果用px为单位的话,在不同移动设备和不同分辨率下,页面的效果可能会有所不同,甚至导致页面变形.所以在次我们就用到 ...
- 小韦系统装工行网银U盾驱动的方法
小韦系统装工行网银U盾驱动的方法 拷贝文件.bat @echo 开始注册echo n|copy /-y scarddlg.dll %windir%\system32\echo n|copy /-y w ...
- 【开源】微信小程序、小游戏以及 Web 通用 Canvas 渲染引擎 - Cax
Cax 小程序.小游戏以及 Web 通用 Canvas 渲染引擎 Github → https://github.com/dntzhang/cax 点我看看 DEMO 小程序 DEMO 正在审核中敬请 ...
- 微信小程序弹出可填写框两种方法
方法一: html页面: < view class = "container" class = "zn-uploadimg" > < butt ...
- 微信小程序开发——以简单易懂的浏览器页面栈理解小程序的页面路由
前言: 对于小程序的页面路由,如果没有一定开发经验的话,理解起来还是会有些困难的.哪怕是有一定小程序开发经验的开发者,能够完全理解掌握的恐怕也不多. 这里就以另外一种方式来详细的介绍小程序的页面栈及路 ...
- 微信小程序:封装全局的promise异步调用方法
微信小程序:封装全局的promise异步调用方法 一:封装 function POST(url, params) { let promise = new Promise(function (resol ...
- JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
本文实例讲述了JS使用正则表达式获取小括号.中括号及花括号内容的方法.分享给大家供大家参考,具体如下: JS 正则表达式 获取小括号 中括号 花括号内的内容 <!DOCTYPE html> ...
随机推荐
- 解释 AOP?
面向切面的编程,或 AOP, 是一种编程技术,允许程序模块化横向切割关注点,或横切典型的责任划分,如日志和事务管理.
- (HTML基础系列1)网页基本结构
元素名 描述 header 标记头部区域内容 footer 标记脚部区域内容 section Web页面中独立的一块区域 article 独立的文章内容 aside 相关文章应用或应用(常用于侧边栏) ...
- js技术之获取字符串中某个字符的位置(lastIndexOf()方法 和 indexOf() 方法)
一.lastIndexOf()方法 1.作用: 方法可返回 一个指定的字符串值 在字符串中最后出现的位置.从左往右查. 2.返回: 一个正整数.或者 -1. 3.语法: stringObject.la ...
- 7_线性控制器设计(Linear Controller Design)
开环系统中 状态方程,其中A的特征值将决定这个系统的表现(稳定性或者收敛速度:特征值小于0时系统稳定) 如果开环系统特征值大于0时(即系统不稳定时): 可以引入输入量U时(U是关于状态变量X的函数), ...
- 创建axios拦截器
上一篇说axios并发的时候有提到 axios的请求统一管理是为了创建拦截器 具体说一下拦截器的创建 import Vue from 'vue'; import axios from 'axios'; ...
- 使用Bootstrap typeahead插件实现搜索框自动补全的配置参数。
示例代码: <input type="text" id="addr"/> <input type="text" hidde ...
- springboot插件
目前spring官网(http://spring.io/tools/sts/all)上可下载的spring插件只有:springsource-tool-suite-3.8.4(sts-3.8.4).但 ...
- CSS简单样式练习(二)
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- react和react-dom是什么?
使用react开发网页的话,我们难免会下载两个包,一个是react,一个是react-dom,其中react是react的核心代码.react的核心思想是虚拟Dom,其实虚拟Dom改变没有那么复杂,简 ...
- 取地址与解引用 C指针浅析
C语言指针入门需要掌握的两个概念就是取地址&和解引用*,下面我们按例子来理解这两个符号的使用. int main() { int a = 0; int* pa = &a;//取地址操作 ...