我使用 border-radius 来环绕我的图像元素,但它没有完全圆形

阿夫申

对不起我的英语不好...

看看下面的代码

 img {
    max-width: 100%;
 }
 #avatar-img {
    border-radius: 50%;
    display: block;
 }

这是输出。它不完全四舍五入

在此处输入图片说明

现在的问题是如何圆这个形象?什么是错与此代码?

MP13

您使用border-radius的百分比值,但高度和图像的widht是不一样的。这是合乎逻辑的两个值的百分比这是不一样的给你不同的结果,因此它是不是圆的。

如果你想让它全面使用图像,其中宽度和高度都是相同的。您可以设置widthheight相同的值

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

我可以使用CSS border-radius属性制作椭圆吗?

我可以像在 vscode 中那樣在選擇中使用 border-radius 嗎?

为什么我的带有两个斜线的border-radius值不起作用?

当我用border-radius聚焦输入时,出现一个方形边框

CSS Border Radius问题

我可以将使用div和border-radius创建的圆划分为6个相等的部分,并获得该点的坐标吗?

CSS Arch是否可以使用border-radius?

使用`border-radius`创建一个圆

使用border-radius CSS时平滑边框

我们如何在不减少边界边缘的情况下将 border-top-radius 设置为 50%?

border-top-left-radius和border-top-rigth-radius没有得到预期的结果

border-radius使div高于其应有的范围

CSS3的border-radius属性和border-collapse:collapse不能混合使用。如何使用边框半径创建带有圆角的折叠表格?

CSS Border Radius Second Radius说明

即使使用border-collapse:separate,border-radius也不会应用于<tr>行标记

Firefox中使用border-radius和border的圆上的针迹:虚线

border-radius和-webkit-border-radius之间的区别

更圆角-Border Radius CSS

Firefox无法使用以下方式正确呈现:border-radius,box-shadow和border

如何将border-radius属性与border-image一起使用以弯曲拐角?

如何向下拉蚂蚁设计元素添加border-radius CSS属性?

如何删除所有以“border-radius”开头的行?(VS 代码)

带有圆角的Pygame按钮,border_radius参数不起作用

CSS border-radius xy是否存在?

CSS过渡移除border-radius属性

是Safari中border-radius的bug?

Border Radius Bottom Bug React Native

CSS border-radius:20px

字体真棒:Fa Bars-Border Radius