新出的html5新增了不少标签，性能更强，原来的很繁琐的功能几个标签就能实现，同时CSS3也推出，更是一大亮点，下面是css3的部分用法，在此总结一下，以供需要的朋友们，总共30个例子

1.长方形

#Rectangle{
width: 200px;
height: 50px;
background-color: red;

本文实例讲述了php实现给图片加灰色半透明效果的方法。分享给大家供大家参考。具体实现方法如下：

原理：

1.首先计算出原图片的尺寸
2.创建相同尺寸的半透明图片
3.使用 imagecopy()方法，把新创建的半透明图片与原图合并

具体实现代码如下：

<?php 
 /*php 给图片加灰色透明效果 @郑州网建*/

直接上代码，类名字就能说明意思：

.camnpr-rotate-90 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

效果如下：

废话不多少，直接上代码：

JS部分： 

function addEvent(obj, evtType, func, cap) { 
cap = cap || false; 
if (obj.addEventListener) { 

一、序言

一直很中意win8等待提示圆圈进度条。win8刚出来那会，感觉好神奇!苦于当时没思路，没去研究。通过最近网上找找资料，终于给搞出来了！先上Demo,献丑了！预览请看：win8进度条。
二、简单介绍

原生javascript编写，需要理解js基于面向对象编程和圆形坐标计算！

实现原理：把每个圆点抽象成一个对象（ProgressBarWin8类型），将每个圆点对象存在数组中（progressArray），延迟执行每个圆点对象的run方法，至于圆点运行速度越来越快，是通过改变定时器延迟毫秒数实现的。 

1、实现原理

本片文章的 是实现原理如下：

* 实际上弹出层、遮罩层和原页面显示分别为三个不同的div

* 弹出层的层级在遮罩层之上，遮罩层的层级在原页面显示之上；

* 遮罩层有通明效果

* 遮罩层没有实际意义，则无需在html部分就写上，当然写上同样可以实现

2、代码实现

html语言如下：

说起“渐变色”，你会想起什么？

当我开始搜索查找这个名词的时候，才发现它实际上是有两种理解或者说是两种形式的：动态渐变和静态渐变。

所谓动态渐变，举个简单的例子：他来了，她的脸渐渐红了...渐渐的，渐渐改变的，是不断在改变的；而静态渐变，也就更简单了：天上一到彩虹，赤橙黄绿青蓝紫啊...在当前展示的成品中，颜色从一部分到另一部分的颜色是不一样的，可能幅度比较小，是逐渐改变的，但有一点是至关重要的，它已经存在了，形成了变化的现状且无法再改变。

这样我们先来用javascript实现一下所谓的动态渐变，考虑动态原因就不上图了，我来简单介绍下思路：

* 动态渐变 

这里面做了一个JavaScript的求爱小特效，效果如下：

不仅能出现下面的图的效果，还可以让这个图形跟随着鼠标转动哦，这里面只是一个简单的没有修饰的小例子，基于这个例子可以让求爱，更加好玩了。闷骚男们，是不是可以给你的小萝莉发个这样的网页啊。给力的。

贴上code吧：

在web页面中，需要改变多个元素的位置，可以通过元素拖动来实现。HTML5中加入了一个全局属性draggable，通过设置true/false来控制元素是否可拖动。

下面以图片拖动为例，用jQuery来实现：页面上有多个图片，把一个图片拖动到其他两个图片中间，就可以将这个图片的位置插入到两图之间。