好有意思的东东，用CSS语法来描述一些事件或者场面，貌似只有对CSS非常热爱的一些极客才能想的到吧，哈哈！
一个叫做Saijo George的家伙，他貌似专门为 Reddit 和 DesignerNews 等这些前端或者UED专业网站供稿时，发现了有些人利用CSS代码可以写一些有趣的双关语，于是，他做了个网站用来收集这些代码，以下代码有些是纯CSS的，有些是Sass语法：
泰坦尼克号
#titanic {
float: none;
}
百慕大三角
#bermuda-triangle {
display: none;
}
哈利波特的魔法斗篷
.invisibility-cloak +
#harry-potter {
visibility: hidden;
}
.invisibility-cloak +
#mad-eye-moody {
visibility: visible !important;
}
美国墨西哥边境
#usa + #mexico {
border: 1px dashed;
}
欧洲的国境线
#europe .country {
border: none;
}
这个……
#china {
border-top-style: solid;
}
狙击模式
.sniper-mode-engaged {
cursor: crosshair;
}
可怜的小鹿班比
.bambis-mom {
cursor: crosshair;
orphans: 1;
}
3K党
.kkk {
color: white !important;
}
元素周期表
#periodic {
display: table;
}
宇宙大爆炸
#big-bang::before {
content: "";
}
查克·诺里斯 wiki
#chucknorris {
color: #BADA55; // badass
}
NSA (National Security Agency)
#nsa {
opacity: 1;
}
比萨斜塔
#tower-of-pisa {
font-style: italic;
}
澳大利亚（这个是说它在南半球的意思吗？）
#australia {
transform: rotateY(180deg);
}
绿巨人浩克
.bruce-banner {
color: pink;
transition: color 10s;
}
.bruce-banner .the-hulk {
color: green;
}
绿箭侠
.oliver-queen {
cursor: arrow;
}
忍者
.ninja {
visibility: hidden;
color: black;
}
小矮妖 百度百科
.leprechaun {
height: 20%;
color: green;
display: none;
}
无边泳池（金沙大酒店？）
.infinity-edge-pools {
overflow: hidden;
}
胖咋！
.obese {
width: 200%;
overflow: visible;
}
浑身栗子肉的人
#muscles {
display: flex;
}
这个，我也不清楚，涉及宗教问题
.religious-upbringing {
perspective: inherit;
}
yo mama 貌似米国电视节目里的人物
.yomama {
width: 99999999px;
}
老婆
.wife {
right: 100%;
margin: 0%;
}
乐高（我的爱，哈哈）
#lego {
display: block;
}
霍比特人
.hobbit {
height: 50%;
}
.hobbit #foot {
width: 200%;
}
德罗宁汽车 wiki
这里应该指的是《回到未来》里那辆DeLorean DMC-12穿越时空到达1955年。
.delorean {
z-index: -1955;
}
恐惧
.fear {
display: none;
}
米国的大麻合法化
.usa > .marijuana-laws {
.federal {
cursor: not-allowed !important;
.state {
cursor: wait;
&.AK, &.CO, &.DC, &.OR, &.WA {
cursor: progress;
}
}
}
}
单行道
.single-lane-road {
width: auto;
}
三星（黑的漂亮，哈哈）
.samsung {
@extend apple;
}
安息吧
#rip {
bottom: -6912px;
// 6912px = 6 feet
}
心脏除颤器
.defibrillator {
clear: both;
}
光明会 wiki
.illuminati {
position: absolute;
visibility: hidden;
}
政府（特指米国）
.government {
transition: all 4yr ease-out;
}
汽车人，变形出发！
#autobots {
transform: translate3d();
}
宜家
#ikea {
display: table;
}
出埃及记吗？哈哈
#moses > .sea {
column-count: 2;
}
对不起啊，我不听Rap大！
gangsta-rap {
word-spacing: 0;
}
血淋淋的现状啊
.rich-people {
top: 1%;
}
.working-class {
bottom: 99%;
}
以上内容参考自： http://saijogeorge.com/css-puns/