多少複雑なデザインでも、画像や JavaScript には頼らず、CSS で実現させる。そこにはもはや手軽さなどは存在しない。あるのは男のロマン。
多少複雑なデザインでも、画像や JavaScript には頼らず、CSS で実現させる。そこにはもはや手軽さなどは存在しない。あるのは男のロマン。
box-shadowでふわりとした影をつくるCSSのジェネレーター、レスポンシブのチェック、アスペクト比の計算機、CSS/JSの軽量化など、たくさんの便利な時短ツールがありますが、それらの便利なツールを一つの場所にまとめたCovelopingを紹介します。 FacebookのOPGチェックやGoogle Mapsの地図生成ツールもあり、新しいプロジェクトを始める時にも役立つものが揃っています。 Coveloping 便利ツールは現在23種類、アスペクト比の計算や一つのカラーに黒と白を加えたバリエーションを生成したり、box-shadowでふわりとした影をつけたり、jQueryのアニメーションのエフェクトなどがあります。 これからもどんどん増えていくそうです。 その中から、いくつか紹介します。
iPhoneサイト制作(スマートフォンサイト制作)をする上で、ソースの無駄な記述を最低限に抑え、通信速度を上げることが「最適化」へとつながります。 スマートフォンサイト用に最適化したcssを制作する場合、reset.cssの記述を減らすことで、重複する命令を減らして、読み込みのスピードを上げることができます。 今回はスマートフォンサイトを制作する上で、最低限必要となるreset.cssの記述について紹介します。 iPhoneサイト制作(スマートフォンサイト制作)にreset.cssは必要? そもそもreset.cssは各ブラウザ(IE・FireFox・safariなど)のブラウザ間のデフォルトのCSSの違いをなくすために読み込むものであり、必ずしもコーディングの際に必要となるものではありません。 PCサイトの場合は様々なブラウザやそのバージョンによって独自のデフォルトスタイルがあるため、r
Normalize CSS [ad#ad-2] Normalize CSSの主な特徴 Normalize CSSの対応ブラウザ Normalize CSSのデモ Normalize CSSの使い方 Normalize CSSの主な特徴 Normalize CSSは、他のリセット用スタイルシートとは一味違った特徴を備えています。 有用なデフォルトはそのまま 多くのリセット用スタイルシートは異なり、有用なデフォルトのスタイルは維持します。 スタイルの正常化 さまざまな種類のエレメントのスタイルを正常化します。 バグの修正 各ブラウザごとの異なるスタイルやバグを修正します。 ユーザビリティの改善 ほんのわずかな改良でユーザビリティを改善します。 コードの説明 各コードには詳細な説明があります。 Normalize CSSの対応ブラウザ 対応ブラウザは下記の通りです。 Chrome Firefox
CSSで描かれたぐぬぬ画像などを見てたら、ふとhtml + CSSだけでアクションゲームが作れないかと思ったので作ってみました。 ページ移動すればいくらでも可能ですが、それだとつまらないので、1ページ内で作るという縛りもつけてます。 デモページ http://ndruger.lolipop.jp//hatena/20110429/css_game/css_game.htm Chrome / Safariの最新版で動きます。Firefox / IEだと動きません。 ソースコード https://github.com/ndruger/css-game 技術的な説明 アニメーションはCSS Animationを使うだけなので簡単ですが、問題は状態管理です。 アクションゲームを作るには、基本的に下記の要素が必要です。 1. ユーザー入力に対する状態の変更 2. 状態の保持 3. 状態に応じて見た目
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く