如何只用HTML和CSS构建一个特殊的多边形(风筝形状)?
16lz
2021-01-22
I'm working on my new project and in this I need some irregular structures. One of them is:
我正在做我的新项目,在这个项目中我需要一些不规则的结构。其中一个是:
What I achieved is:
我实现的是:
.mainkite {
width: 200px;
height: 200px;
background: #f00;
transform: skew(180deg, 180deg) rotate(45deg);
position: relative;
margin: 0px auto;
margin-top: 50px;
overflow: hidden;
}
.midLine {
border: solid 1px #000;
transform: skew(180deg, 180deg) rotate(45deg);
position: absolute;
top: 99px;
width: 140%;
left: -41px;
}
<div class="mainkite">
<div class="midLine"></div>
</div>
更多相关文章
- HTML结构语义化
- 关于结构化、半结构化、非结构化问题
- php标准库 SPL 数据结构之-----SplDoublyLinkedList(双向链表)
- 速率结构的数据库/算法
- 社交登录实现的数据库结构?
- php实现无限级分类的树形结构
- PHP打印输出数组内容及结构函数print_r与var_dump
- KETTLE整库迁移方案(SQL server迁移至Mysql,迁移过程自动创建表结
- 深入理解Mysql索引底层数据结构与算法