<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>多边形</title>
<style type="text/css">
#pentagon_6_1 {
position: absolute;
top: 0px;
height: 0;
width: 100;
border-left: 100px solid rgb(255, 255, 255);
border-top: 100px solid red;
border-right: 100px solid red;
border-bottom: 100px solid red;
}
#pentagon_6_1:before {
content: "";
position: absolute;
left: 100px;
top: -100px;
height: 0;
width: 0;
border-left: 100px solid red;
border-top: 100px solid transparent;
border-right: 100px solid transparent;
border-bottom: 100px solid transparent;
}
#pentagon_6 {
position: absolute;
left: 500px;
height: 0;
width: 0;
border-left: 120px solid transparent;
border-right: 120px solid transparent;
border-bottom: 100px solid red;
}
#pentagon_6:before {
content: "";
position: absolute;
top: 100px;
left: -120px;
height: 140px;
border-width: 120px;
border-style: solid;
border-color: red red transparent red;
}
#pentagon_5 {
position: absolute;
left: 1000px;
height: 0;
width: 0;
border-left: 120px solid transparent;
border-right: 120px solid transparent;
border-bottom: 100px solid red;
}
#pentagon_5:before {
content: "";
position: absolute;
top: 100px;
left: -120px;
width: 140px;
border-width: 120px 50px 0 50px;
border-style: solid;
border-color: red transparent transparent transparent;
}
</style>
</head>
<body>
<div id="pentagon_6_1"></div>
<div id="pentagon_6"></div>
<div id="pentagon_5"></div>
</body>
</html>
1298
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
