为了账号安全,请及时绑定邮箱和手机立即绑定

圆角overflow:hidden在子元素中设置了transform的时候圆角隐藏失败

圆角overflow:hidden在子元素中设置了transform的时候圆角隐藏失败

yunnaneryuan 2015-11-05 17:22:25
css3 父元素是用border-radius:50%设置圆角,overflow:hidden之后 子元素中设置了transform:skew 父元素的overflow:hidden在圆角的地方失效,仅仅是按照父元素为非圆角的时候覆盖子元素这个文艺应该问么解决呢
查看完整描述

5 回答

?
慕粉1325569603

TA贡献1条经验 获得超2个赞

在父元素的css中设置position:relative;z-index:1;即可

查看完整回答
2 反对 回复 2017-07-20
?
慕运维1610465

TA贡献1条经验 获得超2个赞

-webkit-transform:rotate(0deg);

实测有效

查看完整回答
2 反对 回复 2017-01-15
?
肆意妄为

TA贡献8条经验 获得超1个赞

你看下是不是父元素大小的问题,首先你将父元素写成固定大小,而且比子元素小点,再试试。有可能是子元素倾斜的时候对角将父元素撑大了,那样子元素就没有溢出,当然不会隐藏

查看完整回答
反对 回复 2016-01-26
?
arlenhui

TA贡献30条经验 获得超5个赞

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>a</title>
<style type="text/css">
.box {
width: 50px;
height: 50px;
overflow: hidden;
border-radius: 10px;
background-color: green;
}
.red {
background-color: red;
-webkit-transform:scale(1);
       transform:scale(1);
}
</style>
</head>
<body>
<div>
<div>123</div>
</div>
</body>
</html>

似乎没有遇到这个问题,可以贴代码和浏览器版本出来吗?

查看完整回答
反对 回复 2016-01-25
?
weibo_Z__张臻_0

TA贡献1条经验 获得超0个赞

我也遇到了同样的问题。父元素设置了border-radius、overflow : hidden属性,如果子元素设置了transform的话,子元素没有圆角效果


查看完整回答
反对 回复 2016-01-14
  • 5 回答
  • 0 关注
  • 6454 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信