【apicloud】用css写的border-radius 50% 或者 xx rem画的圆不圆

最新推荐文章于 2025-03-27 11:09:54 发布
原创 最新推荐文章于 2025-03-27 11:09:54 发布 · 223 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#css3 #前端

博客提及将内容改成 px 即可，结合标签推测与前端 CSS3 相关，可能是在前端页面样式设置中，把某些元素的单位改成 px 来实现特定效果。

改成 px 就可以了

gz-郭小敏
关注
单选框的小圆点不圆问题
Calla_Lj的博客
02-03 819
单选框的小圆点不圆问题 当我们有时候会做移动端的项目，使用到单选框的话，单选框的小圆点样式代码如下： .circle { display: inline-block; width:16px; height:16px; border: 1px solid #e0e0e0; border-radius:50%; } 这样写其实是没有问题的，但是如果项目需要将px等单位整体进行转换...
解决border-radius：50% 不圆的方法（由于使用了rem）
weixin_42060658的博客
12-04 6931
在写移动端的web页面的时候，发现使用了 border-radius 属性，在pc端正常显示，在手机端却发现无法不圆， 后面在网上查了一下，使用了rem单位设置了宽高，就会出现这种情况，解决方案有两种，一种是把rem换成px单位，另外一种是使用svg的方式 <svg class="back"> <!-- cx: 中心点的x轴的坐标，cy: 中心点的y轴坐标，r...
移动端border-radius绘制圆点不圆
风火燎原、
06-24 1724
问题 border-radius:50%画出来的圆点，在移动端上有的大，有的小，还有的不圆。 原因 一般情况下，只要你几个圆点用的同一个css，那就肯定不是你代码问。而且你查看ios中居然很完美，当然挺贵的安卓手机中基本上也没问题。造成这种原因的情况好几种： 使用了px转rem或者px转vw之类的插件，造成了计算过程中产生误差。 使用了rem或者vw之类像素单位，造成了计算过程中产生误差。 这个情况最操蛋，画圆宽高是奇数，而且圆点比较小，画出的圆就不规则了。 当然可能还有其他情况，毕竟安卓手机版
移动端 border-radius 绘制圆点不够圆 如何解决
CloudJay的博客
02-14 3283
在做项目中,经常会遇到用css绘制像素小圆点的需求,如下代码 .dotted{ width:4px; height:4px; border-radius:50%; background:red; } 在一般情况下,这种代码是没有问题的,但是如果你使用了px2rem之类的插件,就会发现在移动端上的圆点有的大,有的小.十分的难看 个人猜测原因是因为转换工具转出来的单位都是带小数点的,在css...
魔方APP项目-01-移动端开发相关概念、移动端自适配、元信息（meta）、开发准备、移动端项目搭建（模拟器调试）、APICloud（APICloud 前端框架，获取服务端API接口）
Hi文的博客
11-25 1134
一、移动端开发相关概念 1、APP类型 ①.Native APP Native APP又称原生APP，就是我们平时说的手机应用软件。 原生APP 是针对IOS、Android、Windows等不同的手机操作系统要采用不同的语言和框架进行开发出来的，通常是由“服务器数据+APP应用客户端”两部份构成。 实现技术： iOS: 或者 swift Android: java 优缺点 优点： 体验好，用户无法上网也可访问APP应用中以前下载的数据 性能稳定，可调用手机的硬件设备（语音、摄像头、短信、
2021-07-15 border-radius导致原点不圆
weixin_44138241的博客
07-15 588
移动端使用px转rem，结果导致border-radius的安卓手机圆点不圆。 问题发现： 接到一个需求，做一个轮播图，页面有圆点表示当前第几张图。vue的框架，使用了px转rem。发现在安卓手机，border-radius：50%，没有生效，圆点不圆。百度了之后发现有许多这样的问题。参照了各位大佬的解决方法，发现都能解决。以下，都是自己测试生效的方法。 解决方法：1.直接使用px，不转换。 2. 使用transform scale，先提前把px/rem相关的值放大一倍。然后用transform scale
前端知识点 --- border-Radius的四个角(css)
2302_80171619的博客
03-27 508
左上角：水平半径20%，竖直半径5%右上角：水平半径5%，竖直半径20%右下角：水平半径20%，竖直半径5%左下角：水平半径5%，竖直半径20%
border-radius:50%;
04-09
需要确保使用正确的LaTeX格式，不过这个问题可能不太涉及数学公式，所以可能不需要太多数学表达式，但如果有涉及计算的话，比如宽高比例，可以用行内公式，比如当宽高相等时，$width = height$，则border-radius: 50...
border-radius是向元素添加圆角边框的方法
09-28
`border-radius` 支持多种单位，包括像素（px）、百分比（%）以及相对单位如 em 或 rem。使用百分比时，半径值基于元素边框的宽度。需要注意的是，不同浏览器对某些单位的支持程度可能不同，因此在实际应用中要确保...
.abroad-page-module1 .module1-abroadPain-content { position: absolute; display: flex; justify-content: center; align-items: center; width: 12rem; height: 3rem; color: #e3e3e3; background-color: #03031E; border-radius: 1.5rem 2rem 0 1.5rem; border: 0.1rem solid; border-image: linear-gradient(to right, red, yellow) 1; }有渐变但是圆角效果不见了
最新发布
09-16
在CSS中，使用`border-image`设置边框渐变后圆角效果消失，可以通过以下两种方法解决： ### 方法一：使用伪元素模拟边框 这种方法通过伪元素`::before`或者`::after`，使用背景线性渐变模拟实现边框，同时可以设置...
APICloud操作接口SDK for java
07-30
APICloud平台接口，通过此JAR包可以直接操作APICloud云数据库。 封装了云数据库的API接口，避免需要编写URL的麻烦。
ApiCloud屏幕适配原理及实现
Harry Blog
04-27 550
手机屏幕是用户与 App 最直接的交互点 不同的分辨率下用户对我们的 App 具有明显的感观差异，主流分辨率的更新迭代却又完全独立于 App 进行。这让我们想要使 App 在绝大多数主流手机上都保持感观、体验的一致性提出了很大的挑战。 开发者在使用 APICloud 开发移动应用时，经常会碰到选择什么标准的 UI 设计图、如何保证开发出的页面在不同分辨率下保持元素不变形等问题。 现在，您可以
apicloud 第一篇
diansuo8105的博客
01-15 176
　　最近公司需要开发一款app，说实话，之前也只是对Android有过一部分的了解，ios基本上都毛都不知道，所以作为小公司的我们经过商议决定使用apicloud，虽然用户体验不如原生的好，但谁叫我们穷，没钱招人呢，哈哈 这里就针对在使用apicloud开发过程中遇到的问题与相应的解决进行记录和与我相同的小伙伴们一起成长。 　　到apicloud官网下载相应的开发工具，之前做java...
APICloud框架——总结一下最近开发APP遇到的一些问题 (二)
Mr.Yuan
07-15 4866
高度自适应flex布局 允许子元素伸缩手机号正则function checkPhone(data){ if(!(/^1[34578]\d{9}$/.test(data))){ alert("手机号码有误，请重填"); return false; } } function checkTel(data){ if(!/^(\(\d{3,4
CSS的border-radius 设置圆弧
热门推荐
细节打败一切
06-28 3万+
现象： 将div变为有一定幅度的圆形、椭圆形等 方法： 使用css的border-radius 属性进行设置 CSS3 border-radius 属性：向 div 元素添加圆角边框： 一：首先建立一个div 二：给div设置圆角边框的弧度 三：给div设置弧度为50%的时候 正方形就会变为圆形 四：如果给长方形设置50%的弧度 就会得到椭圆形 五：如果需要得到中...
apiCloud小结
CrazBarry的博客
06-16 2835
apiCloud小结
CSS border-radius画圆
10-20 2万+
1.CSS画实心圆 长度和宽度相等，border-radius设置为长度（宽度）的一半。 #circle { width: 200px; height: 200px; background-color: #a72525; -webkit-border-radius: 100px; } 2.CSS画空心圆 和画实心圆方法类似，只是将border大小
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值