ドットインストール代表のライフハックブログ
デザイナは要注目! 明日から語れるHTML5&CSS3:一撃デザインの種明かし(13)(1/4 ページ) ※本稿では特に断りがない場合、Firefox、Google Chrome、Opera、Safariは2010年7月時点の最新バージョン、IEはInternet Explorer 6/7/8の総称です。 いま世界で一番熱い「HTML5」「CSS3」とは? 最近、「HTML5」「CSS3」といった言葉をよく耳にしませんか? これらはWebの表現をもっと豊かにするために策定中の言語です。いままでのHTML 4.01やXHTMLでは実現できなかったことができるようになったり、CSS3はCSS 2.1よりさらにグラフィカルな部分まで表現できるようになりました。 FirefoxやOpera、Safari、ChromeといったHTML5+CSS3に対応するWebブラウザが増えてきたことで、HTML5
こちらの“ドラえもん”のイラスト、どうやって描かれていると思いますか?PhotoshopやIllustratorなどの画像編集ソフトで描かれているようにも見えますが、実はこのイラスト、なんと画像を一切使わずに「XHTML」と「CSS3」のソースコードのみで描かれているとのことです。 ▽CSS3 ドラえもん インターネット上でイラストを公開するには、JPGやGIFといった画像ファイルでアップロードするのが一般的。しかしこちらのドラえもんはそういった画像ファイルではなく、Webサイトを構築する際に使われるXHTMLとCSS3のソースコードのみで作られています。そのため“右クリックで保存”ができなかったり、ブラウザの種類やバージョンによって見え方が異なるのが特徴です。 こちらはFirefox3.6の場合です。FirefoxやGoogle ChromeはCSS3に対応しているので、グラデーションま
Firefox3.6からJavaScriptから加速度センサーの値を取得できるようになりました。この手のセンサーは、移動方向というよりも筐体の傾き検出の方が向いているはずなのですが、そのようなデモがあまりないようなので簡単に実装してみました。Firefox3.6から加速度センサーを利用できる環境が必須です。MacBook系であれば大丈夫なはずです。 バージョン3.6のFirefoxは、加速度センサーに対応していますが、Transform3Dには対応していません。逆に、最新のSafariでは既にTransform3Dに対応しているのですが加速度センサーには対応していません。iPhone用のSafariはTransform3Dに対応していますが、加速度センサーは縦横の方向しか取得できません。加速度センサーとTransform3Dの両方に対応したブラウザが登場し、面白いアイディアのものが色々出て
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く