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>

更多相关文章

  1. HTML结构语义化
  2. 关于结构化、半结构化、非结构化问题
  3. php标准库 SPL 数据结构之-----SplDoublyLinkedList(双向链表)
  4. 速率结构的数据库/算法
  5. 社交登录实现的数据库结构?
  6. php实现无限级分类的树形结构
  7. PHP打印输出数组内容及结构函数print_r与var_dump
  8. KETTLE整库迁移方案(SQL server迁移至Mysql,迁移过程自动创建表结
  9. 深入理解Mysql索引底层数据结构与算法

随机推荐

  1. 程序猿214情人节专题----基于GitHub打造
  2. Android布局优化(一)LayoutInflate — 从布
  3. Android基础笔记(一)-快速入门
  4. 让android支持RTSP及live555分析
  5. Android样式开发——layer-list篇
  6. Android四大基本组件(Activity,Service,Cont
  7. android menu详解
  8. Android音量控制
  9. Android系统框架和开机流程
  10. 在Android上授权Adobe AIR应用程序