2015-07

スポンサーリンク
アニメーションアイコン

css アニメーションを使ってハンバーガーメニューを作ってみた(パート2)

cssのアニメーションで 「ハンバーガーメニュー(パート2)」 アイコンを作成してみました。クリックするとメニューが動きます。 ソース html <div id="svg_box_02" class="svg_box"&gt...
アニメーションアイコン

css アニメーションを使ってハンバーガーメニューを作ってみた

cssのアニメーションで 「ハンバーガーメニュー」 アイコンを作成してみました。 クリックするとメニューが動きます。 mouseoverの記述ですが、iPhoneでこれがあるとフォーカスが外れないようで動きが止まってしまいましたので、コ...
アイコン

– line chart - cssのみで折れ線グラフアイコンを描いてみた

cssのみで 「折れ線グラフ」 アイコンを作成してみました。 ソース html <div class="line_chart"></div> css /* 枠 */ .line_chart { font-si...
アイコン

– bar chart - cssのみで棒グラフアイコンを描いてみた

cssのみで 「棒グラフ」 アイコンを作成してみました。 ソース html <div class="bar_chart"></div> css /* 枠 */ .bar_chart { font-size: ...
アイコン

– area chart - cssのみで面グラフアイコンを描いてみた

cssのみで 「面グラフ」 アイコンを作成してみました。 ソース html <div class="area_chart"></div> css /* 枠 */ .area_chart { font-size...
アイコン

– t-shirts - cssのみでTシャツアイコンを描いてみた

cssのみで 「Tシャツ」 アイコンを作成してみました。Tシャツと書かないとわかってもらえないようなクオリティになってしまいました。斜め線がむずかしいので、直線のみです。 ソース html <div class="t-shirt...
アイコン

– basketball - cssのみで「バスケットボール」アイコンを描いてみた

cssのみで 「バスケットボール」 アイコンを作成してみました。簡単に出来るとおもったら、結構時間かかってしまいました。 ソース html <div class="basketball"></div> css ...
アイコン

– cart - cssのみで「カート」アイコンを描いてみた

cssのみで 「ショッピングカート」 アイコンを作成してみました。斜めの線を使いたかったのですが、うまくいかずに全て直線になってます。 ソース html <div class="cart"></div> css...
その他

– R2-D2 - cssのみで「R2-D2」アイコンを描いてみた

cssのみで「R2-D2」アイコンを作成してみました。 自分の絵心の無さにビックリしています。ご了承ください。 ず~~~っと、「アストロドロイド」だと思っていたら、「アストロメク・ドロイド」だそうです。 「メク」って付くのしりませんでした。...
アイコン

ファイル - css file –

cssのみで 「ファイル」 アイコンを作成してみました。どうしても右上の折り返しがうまく表現できませんでした。仕方ないので丸くなっています・・・ ソース html <div class="file"></div&gt...
スポンサーリンク