青青子衿, 悠悠我心, 但为君故, 沉吟至今
« 程序员追求的是什么?Google推出“灵鼻子”气味搜索 »

巧用CSS文件愚人节恶搞

  明天就是4月1日愚人节了,也就是那个可适度开玩笑、整蛊的日子了。如果你想和那些要上网的朋友或同事开个极客式玩笑,那就来试试这个国外网友Wes Bos分享的 CSS 文件吧。 

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

  本文以 Chrome 为例(CSS 修改后立即生效),进入同事或朋友的电脑,按下面方式打开 Custom.css 文件

  • Mac:~/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css
  • Windows XP:系统盘:\Documents and Settings\用户名\Local Settings\Application Data\Google\Chrome\User Data\Default\User StyleSheets\Custom.css(其他 Windows 系统类似,在个人账号中的找“应用数据” AppData……)
  • Ubuntu (Chromium):~/.config/chromium/Default/User StyleSheets/Custom.css

  二、在 Custom.css 文件中添加相应CSS代码

  1. 网页上下颠倒

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

 

  2. 网页旋转

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

  3. 网页中所有图片上下颠倒

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

  4. 网页中所有图片都自转

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

  5. 网页倒在地上了(请用内容超过多屏的网页测试)

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

  上面就列举这些了,其他恶搞内容,请参见下面这段 CSS 代码

  来源: 伯乐在线  翻译



  除非注明,月光博客文章均为原创,转载请以链接形式标明本文地址

  本文地址:http://www.williamlong.info/archives/3422.html
  • 文章排行:
  • 2.特sea
  • 嗯,好玩,可以实验一下这些功能。
  • 2013/4/22 14:15:23   支持(15)反对(14) 回复
  • 3.mate8
  • 试过之后改不回来了,删了也没用
  • 2013/4/1 13:36:41   支持(13)反对(14) 回复
  • 4.供求信息
  • 高级娱乐方式好,谁要是你的同事,今天可高兴死了
  • 2013/4/1 13:41:56   支持(10)反对(12) 回复

发表评论:

 请勿发送垃圾信息、广告、推广信息或链接,这样的信息将会被直接删除。

订阅博客

  • 订阅我的博客:订阅我的博客
  • 关注新浪微博:关注新浪微博
  • 关注腾讯微博:关注腾讯微博
  • 关注认证空间:关注QQ空间
  • 通过电子邮件订阅
  • 通过QQ邮件订阅

站内搜索

热文排行


月度排行

本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享. 转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议.
This site is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 License.