使用顺风css在大屏幕上设置半径

我想让一个图像只有在屏幕大的时候才有边界半径，否则我希望它有直边，我怎么能做到呢

---

我正在使用Nextjs和Tailwind CSS

你只需要在你想根据屏幕大小有条件应用的任何类上添加

lg:

或

xl:

前缀，看看

下面是一个示例代码：

pages/index.js

export default function Home() {
  return (
    <div className="h-full w-full grid place-items-center">
      <div className="w-32 h-32 bg-red-500 lg:rounded-xl"></div>
    </div>
  );
}

导出默认函数Home（）{
返回(
);
}

你可以查一下