一.平行四边形 1.实心无边框 #parallelogram { width: 150px; height: 100px; -webkit-transform: skew(20deg); -moz-transform: skew(20deg); -o-transform: skew(20deg); background: red; } 2.实心有边框 3.空心有边框 二.梯形 1.实心无边框 #trapezoid { border-bottom: 100px solid red; border-…

前端开发是一项十分繁琐而又耗体力的工作,如何更有效率的开发我们的应用,很多人会选择适当地使用一些jQuery插件.今天就要给大家分享10款可以提高开发效率的jQuery/CSS3组件.部分插件可以下载源码. 1.jQuery图片切换多种过渡效果 这是一款非常绚丽的jQuery图片切换播放插件,图片切换时,拥有几种不同的过渡效果,而且这几种过渡效果是随机出现的.整个jQuery图片播放插件外观也十分大气,图片播放效果流畅. 演示地址    /    源码下载 2.jQuery带事件记录的多功能日历…

代码地址如下:http://www.demodashi.com/demo/11656.html 一.3D风景动态骰子 在线演示 1.css3D.动画基础知识预备 2.创建一个3D场景 先放置一个.box的div父容器,在box里放置一个.dice的div,然后在其里面放置6个div,分别表示骰子的6个面. <div class="box"> <div class="dice"> <div class="surface fron…

前言 估计大家在日常工作中都会用到css形状,但是目前天朝中使用到最多的估计就是圆(circle).椭圆(ellipse).各种三角形形状,但是你肯定很少看见过用几何图形或者多边图形.假如你不懂什么叫做几何图形,那么请前往百度百科,就算是我们用:after :before 这些伪元素来构造我们所需要的形状或者利用边框来曲线救国,但是对于代码来说还是太长了,有没有直接定义几何图形或者是多边形的属性.今天来说说 shape 摘要 关于shape的应用,个人感觉有点奇葩,为什么这么说,因为只能应用于f…

本篇文章主要介绍用CSS3实现的水波扩散涟漪,圆波扩散,光圈扩散,雷达波向外散发动画. 预期效果应该是这样:,其实应该比这个更优美,因为设计师提供的gif出现透明度丢失问题,所以建议用css3实现. 一.明确参数 1.半径 30,42,542.透明度 100%,50%,20%3.颜色 #fb7070 二.实现方案 1.border-width + animation <div parent="box"> <a id="J_dot"></…

<div class="juhua-loading"> <div class="jh-circle1 jh-circle-ios"></div> <div class="jh-circle2 jh-circle-ios"></div> <div class="jh-circle3 jh-circle-ios"></div> <div cl…

<div class="juhua-loading"> <div class="jh-circle"></div> <div class="jh-circle2 jh-circle"></div> <div class="jh-circle3 jh-circle"></div> <div class="jh-circle4 jh…

<div class="parent-box"> <div class="top-arrow"></div> <div class="right-arrow"></div> <div class="bottom-arrow"></div> <div class="left-arrow"></div>…

CSS预处理器sass(基于Ruby服务端版)less(客户端版:基于js; 服务端版:基于nodejs) 前端UI框架JqueryMiniUI: http://www.miniui.com/(适用于管理后台.ERP)Bootstrap 3.3:http://v3.bootcss.com/ (资料齐全.提供less.sass版)AUI: http://amazeui.org/getting-started (中文排版.高度兼容.高度封装.传统css)SUI 1.6:http://semantic…

翻译自https://unity3d.com/cn/learn/tutorials/topics/best-practices/fill-rate-canvases-and-input?playlist=30089#anchor-fn-2 这一章讨论一下在构建Unity UI时容易碰到的问题. 解决填充率问题 有两种方法可以减轻GPU片段管线的压力: * 减少片段shader的复杂度 - 更多详细信息,请看"UI Shader和低端设备"部分. * 减少必须被采样的像素点的数量. 由于…