css设置不规则div的方法示例：
1、设置圆形的div 代码展示：
<style>
.div1{
width: 100px;
height: 100px;
background: red;
border-radius: 50
text-align: center;
}
</style>
</head>
<body>
<div class="div1">圆形</div>
</body>效果图：
般情况下我们可以通过border-radius来改变div的圆角弧度，设置的值可以是像素或者是百分比，但是两者也存在细微的差别。当设置的圆角弧度的像素值大于50px或者50��，div就会变成圆形。
2、设置椭圆形的div 代码展示：
<style>
.div1{
width: 200px;
height: 100px;
background: red;
border-radius:100px/50px;
text-align: center;
}
</style>
</head>
<body>
<div class="div1">椭圆形</div>
</body>效果图：
4、菱形 代码展示：
<style>
.div1{
width: 100px;
height: 100px;
background: red;
text-align: center;
transform: rotate(45deg);
margin:100px;
}
</style>
</head>
<body>
<div class="div1"></div>
</body>效果图：
transform中的rotate属性用于设置元素的旋转，rotate(45deg)表示将元素旋转45度。
以上就是css如何设置不规则div？的详细内容，更多请关注易知道|edz.cc其它相关文章！
