如何保持元素的边框半径不变而缩放元素？

可以使用CSS的transform属性中的scale() 函数 来缩放元素，同时使用border-radius属性来保持元素的边框半径不变。

代码示例：

HT ML ：

<div cl as s="box"></div>

.box { width: 100px; height: 100px; background-color: red; border-radius: 50%; /* 圆形的边框半径为元素宽高的一半 / transform-origin: center center ; / 设置缩放的中心点为元素中心 */ transition: transform 0.3s e as e;

.box:hover { transform: scale(1.2); /* 鼠标悬停时放大1.2倍 */

在上述代码中，元素的宽高都是100px，并设置了红色背景色以及圆形的边框半径（值为50%），使用了transform-origin属性来设置缩放的中心点为元素的中心。当鼠标悬停在元素上时，使用CSS的:hover伪类选择器来为元素设置缩放的动画效果。使用transform属性中的scale() 函数 来实现元素的缩放，而由于设置了border-radius属性，所以元素的边框半径会保持不变。