【发布时间】：2022-01-16 11:51:33
【问题描述】：
我不希望我的轮廓有圆角，但在动画过程中它变宽时会变圆。
编辑：我在 Linux、MS Edge 中得到了以下外观，并查看了我在 Mozilla Firefox 上尝试过的反应，它似乎可以完美运行，这正是我想要的。但是对于那些可能使用 MS Edge 的人，有没有可以应用的解决方案？
.btn {
width: 20%;
height: 15%;
font-size: larger;
border: none;
background-color: darkgrey;
transition: outline-offset 1s;
}
.btn.border-pop:hover {
outline: solid darkgrey;
outline-offset: 10px;
}
【问题讨论】：
-
我在您的 codepen 中没有看到任何圆形轮廓。你用的是什么浏览器？
-
在现代 Firefox 上，Codepen 中的按钮轮廓对我来说没有显示任何圆角；并且您在那里使用的任何 CSS 都不应该导致这样的事情。你有 Codepen 的问题吗？您确定它不是由另一个（您的一部分）样式表添加的吗？我建议使用您的浏览器检查工具（F12 -> 左上角的图标）来查看应用了哪些 CSS 语句以及从何处应用。 （如果有很多事情要做，请搜索轮廓半径）。
-
我已经添加了它在动画时的外观。
-
使用元素检查器查看哪些 CSS 块会影响该按钮，看看是否包含类似
outline-radius的内容；或border-radius/outline-something；您可以在元素检查器中打开/关闭这些特定语句，并使用它来查找有问题的语句。