タグ

2011年12月27日のブックマーク (6件)

  • 俺の CSS リセット: 2011 冬

    年末だからというわけでもないのですが、いつものサイト作りに使う CSS リセットについて見直してみました。今までもちょっとずつ手を入れてはいたのですが、今回はかなり大きく修正しています。というのも、Nicolas Gallagher と Jonathan Neal の両氏による normalize.css を知り、大きく影響を受けたからです。 Normalize.css は「新手の CSS リセット」ではありません。CSS を「リセット」するのではなく「ノーマライズ」する、という新しい考え方です。CSS リセットとノーマライズはどちらも、ブラウザ間で CSS の実装に差異があることを前提にそれらを吸収しようとする、という同じ目的を持っています。ただ、リセットはすべてをまっさらな「さら地」にしようとするのに対し、ノーマライズは使える部分は残しつつ手を入れる必要のある部分だけを整える、という違

    俺の CSS リセット: 2011 冬
  • Browser History Timeline

    Sources http://www.quirksmode.org/browsers/history.html http://www.blooberry.com/indexdot/history/browsers.htm http://en.wikipedia.org/ (various articles on specific browsers) See Also Wikipedia's browser timeline Thanks to… Kimberly Blessing, for keeping the timeline information up to date since early 2013.

    ama-ch
    ama-ch 2011/12/27
    ブラウザ年表
  • Sass で Singleton を実現し、安心してクラスを再利用する | nodot

    この article は Less & Sass Advent Calendar の23日目のエントリーとして書かれています(あれれ?!)。 概要 CSSメタ言語を導入する目的の一つにリソース再利用性の実現というものがある。Sass の場合、mixin や extend によって実現している。特に extend によるスタイルの継承は強力である。 しかし再利用できるようなクラスをまとめたライブラリを import して利用すると、実際には使われていないクラスも出力されてしまい、ファイル容量が無駄に肥大する。使うクラスだけコピーするとか、使わないクラスは削除するなどの手動管理は手間がかかる。 そこでクラス自体を出力するような mixin を作れば、必要なクラス定義だけを include でき、不要な CSS コードを出力しなくて済む。しかし、extend したいクラスを必要になる度に inc

  • Sass(Scss) Memo: 出力形式 compressed | Culture27

    余計な改行や空白は削除されます。 例外として、セレクタの結合子(+ や >)の前後には空白が挿入されます。 最後のプロパティのセミコロン(;)や余分なセミコロンが削除されます。 カラーコードは6桁のまま出力されます。3桁にはなりません。 ただし、Mixinを通したものはどの出力形式でも条件によって出力される値が変わります。 rgbは可能なものはカラーコードに変換されます。 0pxは0にはならず、そのまま0pxで出力されます。 noneは0にならず、そのままnoneで出力されます。 0.5emは.5emにはならず、そのまま0.5emで出力されます。 空の宣言ブロックは出力されません。 CSS/Sassコメント Scss selector-1 { margin: 0; } /* * 複数行CSSコメント * 複数行CSSコメント */ selector-2 { /* 1行CSSコメント */

    ama-ch
    ama-ch 2011/12/27
    CSSハック
  • HTML5 Boilerplateを読む | complicate000 blog

    HTML5 Boilerplateは、HTML5を扱うためのベストプラクティスが詰め込まれたHTML/CSS/JSのテンプレートです。 このテンプレートに含まれるHTMLCSS、JSに沿ってコードを書いていくことで、正当かつ洗練されたHTML5のサイトが制作でき、さらに、予め用意された方法でbuildすれば、HTMLCSS、JS、そして画像の圧縮によって軽量化も実現します。 今回はHTML5 Boilerplateについて理解を深めるために、基となるHTMLのテンプレートを読み下していきたいと思います。 (CSS、JSの分析、ビルドの仕方については次回以降..) ■HTML5 Boilerplateとは HTML5 Boilerplateについて、公式サイトにはこう書かれています。 HTML5 Boilerplate is the professional badass’s bas

    ama-ch
    ama-ch 2011/12/27
    HTML5 Boilerplateはほんとに参考になる
  • "リアルタイム Web" に関するプラクティスのアウトプット - Block Rockin’ Codes

    追記 11/12/26 MLのスレッドへのリンクが間違っていたので修正。 introduction WebSocket なんかをつかって、従来のステートレスな処理以外に、コネクションを継続するステートフルな処理が可能になりました。 これを利用すると、これまで実装が難しかったリアルタイムな表現を Web に持ち込むことができます。 そして、 WebSocket を用いたプログラムを作成する上で、Node.js と Socket.IO を用いる方法について、 今年はこのブログでも何度か紹介してきました。 今日は今年一年の集大成として、自分が色々試しながら得たリアルタイム Web に関する知識、技術などを、 ここにまとめてアウトプットしたいと思います。 今回お話しするのは、 東京Node学園 3時限目 : ATND で発表した下記内容の抜粋です。 Node Academy | "About Sl

    "リアルタイム Web" に関するプラクティスのアウトプット - Block Rockin’ Codes