スタイルシートのネーミングにセンスを感じる30個
ウェブデザイナーの仕事にはそれなりの痛みと苛立ちが伴ないますが、ダジャレは健全な笑いの感覚と地元社会に密接に関係しているのです。
ホームページ制作の現場は過酷な環境に陥りがちです。
そんな中にもユーモアセンスを取り込むウェブデザイナーのセンスは秀逸です!
![ホームページ制作を楽しくするスタイルシートのネーミング](https://studio110.info/wp-content/uploads/2015/03/css-puns-wife-e1426213339743.jpg)
#妻{
正しい:100%;
余地:0%;
}
これらはデザイナーでなくても誰もが楽しめるものだと思います!
このRedditのスレッドにはもっと面白いものがあるので日常生活、映画、政治的問題などに関するホームページにおけるスタイルシートのユーモア30個の笑えるダジャレを紹介していきます。
ようこそ99%クラブへ
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-people-class-e1426214107940.jpg)
・富裕層{
トップ:1%;
}
・労働者階級{
ボトム:99%
}
結婚生活で一番大切なこと
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-wife1-e1426214145981.jpg)
#妻{
正しい:100%
余地:0%
}
夫婦喧嘩で勝った唯一の男
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-chucknorris-e1426214177687.jpg)
#チャック・ノリス{
色: #スゲー;
}
忍者!
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-ninja-e1426214226351.jpg)
・忍者{
色: 黒;
登場 :不明;
登場時間:0.00001秒;
}
幽霊の単純形式
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-ghost-e1426214263506.jpg)
・幽霊{
色: 白;
不透明度:0.1;
}
エミネムが話す
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-eminem-e1426214295989.jpg)
♯エミネム{
語間調節:0;
}
ブルース·バナーに手を出すな
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-hulk-e1426214339334.jpg)
♯ブルース-バナ-{
色:ピンク;
変化: 色10秒;
}
♯ブルース-バナ-.ザ – ハルク {
色: 緑;
}
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-kim-kardashian-e1426214365692.jpg)
キンカーダシアンがヘッドラインを飾る方法
♯キン-カーダシアン{
尻-叩く:9999px ;
}
マリオの秘密
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-mario-bros-e1426214505500.jpg)
♯マリオ.キノコ{
変化: 尺度(200%);
}
この町で失敗!
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-oliver-queen-e1426214534917.jpg)
・オリバー-クィーン{
カーソル:アロー;
}
オートボッツ、ロールアウト!
![css-puns-autobots](https://studio110.info/wp-content/uploads/2015/03/css-puns-autobots.jpg)
・オートボット{
変化:3Dになる();
}
「良いアーティストは盗み、偉大なアーティストは複製する」
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-samsung-vs-apple-e1426214669945.jpg)
♯サムソン{
@延長 アップル;
}
イケヤがテーブルを作る
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-ikea-e1426214710382.jpg)
♯イケヤ{
展示: テーブル;
}
レゴは絶対に列を作らない
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-lego-e1426214759688.jpg)
♯レゴ{
展示: ブロック;
}
ハリーポッターは知るべき
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-invisibility-cloak-e1426214813421.jpg)
♯透明-マント{
可視性: なし;
}
疲れ目の方
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-lens-glasses-e1426214851470.jpg)
・無し-レンズ-眼鏡{
フィルター:不鮮明(50px)
}
・あり-レンズ-眼鏡{
画像レンダリング:質の向上;
テキストレンダリング:読みやすさの向上
}
盛り上がった雛
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-push-up-bra-e1426214891223.jpg)
・プッシュ-アップ-ブラ{
余白-上部:-25%
桁あふれ:当然;
}
そうして塔がデザインされた
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-tower-of-pisa-e1426214928447.jpg)
♯タワー-ピサ{
フォント: イタリック体;
}
歴史的瞬間
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-berlin-wall-e1426214962851.jpg)
♯ベルリン-壁-1989{
国境-破壊:破壊;
高さ:0;
}
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-great-wall-e1426214998477.jpg)
♯万里の長城♯中国産
♯中国{
縁-トップ-スタイル:頑丈;
}
世界を支配すると言われる秘密組織
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-illuminati-e1426215051370.jpg)
・イルミナティ{
権限:絶対的
視覚:不明
}
君主制とは
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-monarch-e1426215085554.jpg)
・統治者{
権限: 継承;
}
政治の動き
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-goverment-e1426215115886.jpg)
・政府{
変化:4年で辞任;
}
議会の逆とは何かについて冗談を言う理由は
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-congress-person-e1426215225815.jpg)
・議会-人{
統合-自己: 継承
色 : 継承
権限: 執着
視界: 不明
未来-変革: 変化;
}
靴を履かないのも無理はない
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-hobbit-e1426215257842.jpg)
・ホビット{
身長: 50%;
}
・ホビット ♯足{
幅: 200%;
}
国境のない国
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-europe-e1426215290351.jpg)
♯ヨーロッパ・国{
国境:無し;
}
国境のようなものがある国
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-usa-mexico-e1426215321714.jpg)
♯U.S.A +♯メキシコ{
国境: 1人 ダッシュ;
}
早すぎる
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-titanic-e1426215356299.jpg)
♯タイタニック{
浮く : 無し;
底 : 0;
}
受かりたかったので何かした
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-moses-e1426215386285.jpg)
♯モーゼ 〉.海{
コラム数: 2;
}
飛行機と船の404エラー表示(未検出表示)
![ホームページ制作にユーモアあふれるスタイルシート](https://studio110.info/wp-content/uploads/2015/03/css-puns-bermuda-e1426215422338.jpg)
♯バミューダ-トライアングル{
ディスプレイ: 無し;
}
まとめ
いかがでしたでしょうか?
スタイルシートをこんな風に活用したら、ホームページ制作も楽しくなってしまいますね。
表面だけではなく、要素まで確認する事で、意味が分かるようになっている仕掛けも面白い!!
ウェブサイトを構築する際に試してみては??