如何用css制作图片自动圆角，谢谢了！

html-css016

如何用css制作图片自动圆角，谢谢了！,第1张

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<style>标签中，输入css代码：img { border-radius: 20px}。

3、浏览器运行index.html页面，此时页面插入的图片会自动显示圆角20px的。

给图片加入boder-radius，数值越大，图片的圆角弧度越大。

img{border-radius: 25px}

如图

原图

如果圆角要求不一样，可以这样写

img{border-radius:25px 10px 50px 0}//左上角、右上角、右下角、左下角(顺时针顺序)

这样写左下角无弧度。