マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

CSS その他

【css技術】CSSだけで生成された歴代Appleのマウスがスゴい

投稿日:2013年10月22日 更新日:

img

css3の普及で、画像を使わなくとも
ボタンで使用する様なグラーデーションや形など、
様々な表現を実現することができるようになってきました。

こうした機能も、上手く使いこなせるようになれば
こんなことだって出来てしまうんですね!

http://codepen.io/joshbader/details/fKjra

なんとcssだけで歴代のAppleのマウスが形作られています。
これは・・・スゴい!

こうした技術の開発はどんどん進んでいますので
時代を追うごとに、より多彩な表現が可能になっていくのでしょうね。
近い未来が楽しみです。

-CSS, その他

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

手軽に雰囲気を変える!無料英字webフォントのまとめ -個性的編-

手軽に雰囲気を変える!無料英字webフォントのまとめ -個性的編-

webフォントは日本のホームページには今一歩馴染みが無いかもしれませんが これから先、SEOを視野に入れたものはほぼテキストで作成することが望まれます。 今回はその第一弾として「個性的な英字フォント( …

超簡単!【CSS3】ロールオーバー効果

超簡単!【jQuery】ロールオーバー効果 こちらではjqueryで簡単にロールオーバーをかける方法をご紹介しました。実はCSS3でも全く同じ効果を再現できるので、今回はCSS3でロールオーバー効果を …

知ってそうで知らないCSS3の便利な使い方【その1:構造疑似クラス編】

CSS3のセレクタは幾つもありますよね。 今回はその中の構造疑似クラスで、私がよく使う便利な構造疑似クラスをご紹介します。 E:first-child 親要素の最初の子要素であるE要素に適用 E:fi …

簡単便利!30秒でできる!【photoshop】で線画を抽出する方法!

簡単便利!30秒でできる!【photoshop】で線画を抽出する方法!

線画イラストの線画だけ抜き出したい!背景を透過したい!!・・・そんな時に役立つphotoshopの小技をご紹介します。   (1)まず、画像をphotoshopで開きます。 (2)メニューの …

デザインの幅が広がる!クオリティの高いイラストサイトまとめ

みなさん こんばんは! デザイナーKです! 今回、私が皆さんにご紹介する内容は! 仕事で使えるイラスト素材サイトです!! 1.ほらぱれっと 私が好きなパステルトーンの可愛い素材が揃っているサイトです。 …