在线添加圆角

什么时候需要把圆角直接烧录进文件里

在实时网页上，CSS 的 border-radius 完全能胜任圆角效果，但很多场景无法依赖浏览器来渲染它。邮件客户端经常会去除或忽略 border-radius，因此一张营销邮件里的圆角产品照或头像，只有当文件本身已经带有透明圆角时，才能真正显示为圆角。同样的局限也出现在 PDF、按原样显示图片的原生应用视图、幻灯片，以及那些不会套用您站点样式表就直接渲染上传素材的社交平台上。 App 图标和 favicon 制作是另一个常见场景。有些平台会自动为方形 PNG 做遮罩处理，但对于预览素材、图标的营销截图，或者不会应用自身遮罩的展示场景，自己给源图片加上圆角，能让它和用户实际看到的遮罩版本保持视觉一致。 头像和个人资料图片也遵循同样的逻辑：如果您要把一个圆角头像合成进一张更大的压平图形——证书、工牌、导出为单张图片的名片版式、视频缩略图——圆角必须在压平之前就存在于源像素中，因为只应用在原始元素上的 CSS 圆角，在被烧录进静态导出文件时是不会保留下来的。 由于处理完全在您的浏览器中进行，这也适用于那些您不太想发送到服务器的素材——包含个人信息的截图、尚未发布的产品照片，或者内部工具素材——为了得到圆角效果，没有任何内容会被传输到任何地方。