css3将矩形截取成正方形

CSS3是一种较新的技术，它可以改善网页的视觉效果。本文将讲解如何使用CSS3将矩形截取成正方形。

/* CSS3正方形截取*/
.square{
   width: 300px;
   height: 300px;
   background-color: #ccc;
   clip-path: inset(0 0);
}

上面的代码片段基本分为四个部分，分别是宽度、高度、背景颜色和裁剪路径。由于CSS3不仅仅可以截取矩形，所以需要使用clip-path样式将截取效果设置为“inset(0 0)”。

首先，输入一个HTML文件，并在页面顶部的