码迷,mamicode.com
首页 > Web开发 > 详细

项目实战之玩转div+css制作自定义形状

时间:2015-08-16 23:09:18      阅读:200      评论:0      收藏:0      [点我收藏+]

标签:css

项目需求:

技术分享

要求制作上图所示的效果,能达到灵活可配的效果。我想初步想法是用div+css来制作。

抽象模型:

面对复杂的问题,要学会抽象当前的问题。下面的这个模型是我抽象出来的一个简单的解决方案。

技术分享

这样我们就可以用各种css效果来组合出我们需要的效果,放到网站中可以灵活配置图形的各种样式。

技术难点:

1、如何做到让div旋转?

       -moz-transform: rotate(90deg);

       如果设置的值为正数表示顺时针旋转,如果设置的值为负数,则表示逆时针旋转

2、如何设置div的层次关系?

     z-index



版权声明:本文为博主原创文章,未经博主允许不得转载。

项目实战之玩转div+css制作自定义形状

标签:css

原文地址:http://blog.csdn.net/cxl0921/article/details/47707875

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!