Css 在悬停时使用transform:scale（）时，如何维护图像的边界半径属性？

我想在网页中鼠标悬停时缩放图像。图像位于表格单元格中。我应用了变换：比例（1.2）。它工作正常。但问题是图像有边界半径：10px，当鼠标指针指向图像时，图像边界半径变为零。完全转换后，它又变成10px。 我想在缩放时保持不变。它不仅在谷歌chrome上有效。 这种效果的CSS如下所示

.ProductImageStyle {
 border-radius:10px;
 display:block;
 overflow:hidden;
 -webkit-transition:all .5s;
 transition:all .5s;}

.ProductImageStyle:hover {
 -webkit-transform:scale(1.2);
 transform:scale(1.2); }

.ProductTableCell {
overflow:hidden;
text-align:justify;
border-radius:10px; }

下面是asp.net代码

<asp:Table ID="tblProducts" runat="server" CellPadding="0" CellSpacing="20">
        <asp:TableRow>
            <asp:TableCell CssClass="ProductTableCell">                    
                <asp:Image ImageUrl="./Images/1.jpg" runat="server" Height="200" Width="100%" CssClass="ProductImageStyle"/>                    
            </asp:TableCell>               
        </asp:TableRow>
</asp:Table>

---

请提供适当的解决方案。谢谢

您是否尝试将边框半径应用于包装图像的元素，而不是图像本身？我已经有一段时间没有看到WebForms.NET了。。。你有呈现的HTML输出吗？没有，先生！我没有试过这样的事。你能指导我这样做吗？有什么解决办法吗？对不起，我还没有得到任何东西(