前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >border-radius属性失效问题的解决办法

border-radius属性失效问题的解决办法

作者头像
王小婷
发布2018-11-09 15:42:01
3.2K0
发布2018-11-09 15:42:01
举报
文章被收录于专栏:编程微刊编程微刊

今天调试项目的时候突然发现,设置的border-radius竟然失效了,打开f12,眼看着浏览器把这个属性也给划掉了,不是一般的郁闷,按照道理来说,不应该会出现这样神奇的bug。

图片.png

css代码:

代码语言:javascript
复制
#photo{
width: 80px;
height:80px;
border-radius:10px ;
}
解决办法:万能的!important;

在border-radius属性里面添加!important:

CSS中的!important一般都是用于对低版本的除了iE 6 ,用来做hack的,后面缀上了!important的css语句,让浏览器首选执行这个语句,因为css有继承的样式,加上!importanrt可以覆盖父级的样式。

代码语言:javascript
复制
#photo{
width: 80px;
height:80px;
border-radius:40px !important;
}

完美解决:

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2018.10.23 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 解决办法:万能的!important;
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档