Cacher is the code snippet organizer for pro developers

CSS极客式恶搞

下面以chrome浏览器为例。

一、打开浏览器的Custom.css文件

该文件一般在个人账号%APPDATA%/Local/Google/Chrome/User Data/Default/User StyleSheets文件下下面，也可以在C盘搜索Custome.css文件，修改该CSS文件后，Chrome浏览器会实时读取该文件，并应用，你要整蛊的人就可以看到各种奇葩效果啦。

1. 上下颠倒

/*
* Turn every website upside down 
*/
body {
  -webkit-transform: rotate(180deg);
}

2. 旋转网站

/*
 * 2. Spin every website
 */
body {
  -webkit-animation: spin 5s linear infinite;
}

3. 图片颠倒

/*
 * 3. flip all images upside down
 */
img {
  -webkit-transform: rotate(180deg);
}

4. 图片旋转

/*
 * 4. spin all images
 */
img {
  -webkit-animation: spin 1s linear infinite;
}

5. 网站透视

/*
 * 5. make every website fall over
 */
html, body {
    height: 100%;
}
html {
    -webkit-perspective: 100;
}
body {
    -webkit-transform-origin: bottom center;
    -webkit-transform: rotateX(-90deg);
    -webkit-animation: fall 1.5s ease-in;
}

不难发现，其实就是利用了CSS3的一些新特性，整浏览器应用。你也可以挖掘CSS3的一些新特性，实现更加有趣的效果。