cssに関するknakatomiのブックマーク (4)

  • 暴満館 » JavaScriptでCSSを弄る際のメモ

    このエントリは、JavaScriptによるCSSの操作として新たに書き直しました。 – 俺の探し方が悪いんだろうが、JavaScriptCSSを弄るリファレンスが中々見当たらなかったので、メモも兼ねて書く。 結構適当に書いてる部分もあるので鵜呑みにしないように。あと、Operaは知らね。 スタイルシートのルールを弄る div内の全要素をgetElementsByTagNameで拾ってforで回してstyleに・・・ってなことをやるよりも、スタイルシート側から操作できるようになれば楽になる。 function addRule( selector, property ) { if( document.styleSheets[0].addRule ) //IE document.styleSheets[0].addRule( selector, "{" + property + "}" );

  • Dynamic Drive CSS Library- Practical CSS codes and examples

  • line-height の値には単位なしが良いとされる理由

    CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位なし (number) で指定した方が良いのにとか思ったりする。その理由は Eric's Archived Thoughts: Unitless line-heights でも分かりやすく説明されているんだけど、ちと劣化コピーしてみる。 単位ありと単位なしの違い 手っ取り早く説明するために、サンプルを作ってみた。p 要素があって、その中にインライン要素の em で一部分を強調している。分かりやすいようにそれぞれの font-size

  • CSS3 の否定疑似クラスの使いどころ - lucky bag

    CSS3 の否定疑似クラス :not() って、使う機会があまり無さそうとか思ってたんだけど、Bite Size Standards で属性セレクタと組み合わせた使用例が紹介されてて、なんかそのピンポイントで指定できてる感がクール!つうか、そうか、そういう使い方かぁ。 input[type="text"]:not([size]) { width: 15em; } 上記コードを解説すると、type="text" な input 要素で size 属性が指定されていないものは width: 15em; ってことになる。うーん、これをユーザスクリプトで指定しておくのも良いかも。size が指定されてなくて入力欄の幅が狭いのって意外とストレス感じるし。 自サイトでも、クラスや ID をわざわざ付与してなくても否定疑似クラス使って指定できるもんって他にもありそう。例えば、(X)HTML の方で wi

  • 1