CSS3
Sassで＆を使ってCSSの記述をコンパクトにする
input[type=”text”]{ border-color: #eee; background: #eee; &:focus{ background: #fff; } } input[type=”text”…
CSS3: ページ内リンクの飛び先にスタイルを適用できるE:target 擬似セレクタ
ページ内リンクで、飛んだあとのスタイルを指定することができます。つまりリンクをクリックする前と後で表示を変更できます。 CSS :target { color: red; } HTML <ul> <li…IE8では利用できない擬似セレクタ
あるdivの中でul要素が１つのみある場合に適用したいスタイルがあり、「:only-of-type」セレクタを使おうと思ったのですがこちらはIE8では利用できないようです……。 ※ :only-of-type については…Flexboxの使い方カンタンまとめ
Flexboxという夢のようなものが、徐々にモダンブラウザで安定した実装を行えるようになってきたということで、使い方の簡単なまとめをメモ。 参考：これからのCSSレイアウトはFlexboxで決まり！ 基本の使い方 <…E[foo$=”bar”]セレクタで拡張子によってリンク色を変更する
E[foo$=”bar”]を利用することでfoo属性の文末の値がbarで終わる場合に適用されるスタイルを指定できます。 CSS a { color:#000; } a[href$=”.jpg”] { color:#f00…子要素が一つのみの場合に適用される「:only-child」と「:only-of-type」セレクタの違い
使ったことのないCSS3セレクタについて調べてみるシリーズです。 「:only-child」セレクタと「:only-of-type」セレクタはどちらも子要素が一つのみの場合に適用される指定なのですが、 他の子要素も含める…「::first-line」セレクタを利用して1行目のテキストを強調する
「::first-line」セレクタを利用することで、1行目のテキストを強調できます。 CSS p { font-size:13px; } p::first-line { font-size:22px; }