css使方框变圆 |css插入图片不显示

css避免拉伸，css 新闻内容模板，css3邮票边，菜鸟css基础知识，css文字怎么设置阴影背景，css3动画渐渐显示，css插入图片不显示 css使方框变圆 |css插入图片不显示

/* 第一种方法：使用border-radius */
.box {
border-radius: 50%; /* 将方框半径设置为50%，即变成圆形 */
}
/* 第二种方法：使用transform */
.box {
transform: scale(1.0); /* 缩放比例为1，变成圆形 */
border-radius: 50%; /* 将方框半径设置为50% */
}
/* 第三种方法：使用伪元素 */
.box::before {
content: '';
display: block;
padding-top: 100%; /* 高度设置为width的百分比 */
}
/* 第四种方法：使用clip-path */
.box {
clip-path: circle(50%); /* 将方框剪裁为圆形 */
}

以上是几种将方框变成圆形的CSS技巧，只需要根据自己的需要选择其中一种即可。同时，也可以通过改变半径大小和使用不同的类型来实现更多的效果。