首页 > 其他分享 >border出现虚边问题解决

border出现虚边问题解决

时间:2023-02-28 21:04:33浏览次数:47  
标签:2px top 100px radius 虚边 解决 border


当我们只给元素设置了border-top,没有设置其他边框的时候,如果我们使用了border-radius会出现虚边的情况,如下所示:

css代码:

div{width:100px; height:100px; border-top:2px solid #000; border-radius:50%; }

效果图如下:

border出现虚边问题解决_css

很明显我们可以看到两侧的虚边,这是我们不想要的,解决办法很简单:只需要给其他的边框也都设置上,并且设置边框颜色为透明即可(当然要放在我们设置的border-top前面哦)如下所示

div{width:100px; height:100px;border:2px solid transparent; border-top:2px solid #000; border-radius:50%; }

效果图如下:

border出现虚边问题解决_css_02

ok,就是这么简单

前段时间因为有事比较忙,所以没有更新博客,以后如果没有特殊情况还是会持续更新的,每天进步一点点,加油

标签:2px,top,100px,radius,虚边,解决,border
From: https://blog.51cto.com/u_15983333/6091801

相关文章

  • Git 提示fatal: remote origin already exists 错误解决办法
    Git提示fatal:remoteoriginalreadyexists错误解决办法先删除远程Git仓库$gitremotermorigin再添加远程Git仓库[email protected]:FB......
  • 跨域问题的CORS解决
    跨域问题的CORS解决1为何会出现跨域问题:浏览器的同源策略1.1同源策略(Same-originpolicy)同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,......
  • 跨域问题解决
    目录跨域请求问题解决解决跨域问题方式简单请求与非简单请求自己编写中间件处理跨域请求问题解决同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全......
  • 解决 Private Network Access(CHrome 94问题)
    长期解决方案针对企业级的解决方案:我们可以通过管理员控制的方式来更改chrome的相关配置,参考临时解决方案。针对SaaS用户首选方案是将站点部署为HTTPS,引用Chrome......
  • Linux Qt编译时出现has modification time int the future的解决方法
    问题场景:我在window系统上合并完代码后,将代码通过TF卡拖到了Debian系统的开发板子上(为什么我不用Winscp或者xhttp传呢?因为网线被同事拿走了。。。),然后就报这个错。网上查......
  • JavaScript文件夹上传解决方案
    ​ 项目描述工具类包封装了一些关于分片md5验证、断点续传、分片上传、等方法前端样例使用百度插件WebUploader,插件的源码还是有一定的问题的分片上传是需要前后......
  • 恒创科技:服务器常见错误代码501什么意思?怎么解决?
    ​作为网站所有者,很少有情况比打开您的网站时收到HTTP错误代码更令人恼怒和困惑,除非您精通网站运营的后端基础设施和网络配置方面。对于501NotImplementedHTTP......
  • JS文件夹上传解决方案
    ​ 我们平时经常做的是上传文件,上传文件夹与上传文件类似,但也有一些不同之处,这次做了上传文件夹就记录下以备后用。这次项目的需求:支持大文件的上传和续传,要求续传支持......
  • 解决Java读取数据库的时间类型时大8小时时差问题
    解决办法:在jdbc连接中设置serverTimezone参数,指定为东八区,可以使用serverTimezone=Asia/Shanghai或者serverTimezone=GMT%2b8如:jdbc:mysql://127.0.0.1:3306/demo_ds......
  • UPX is not available解决办法
    1.UPXisnotavailablepyinstaller添加图片打包成exe时遇到这个问题,如图所示。需要下载upx.exe,放在pyinstaller.exe同一个目录下。把upx.exe放在如下目录:......