勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

CSSで1つの要素に複数classを設定して画像を入れ替える

   

メニューリンクで通常時の画像、マウスオーバー時の画像、アクティブ時の画像をそれぞれCSSで指定したかった。通常時とマウスオーバー時は普通のbackground指定とhoverでいけたんだけど、アクティブ時に同一要素に複数classをつけるのはよいものの、どうCSSで指定したらよいのか分からなかった。

調べてみると以下方法でいけた。

 

■ソース

 

■その他

CSSパスを指定する際に半角スペースをあけると下位要素につながるのとは別に、つなげて書くと絞込み指定ができるみたい。知らんかった。

 - CSS

  関連記事

images
固定ヘッダーメニュー

やりたかった事は、 ・6つぐらい異なるドメインのページがある ・似たような用途な ...

images
CSSでプロパティの初期化

CSSでmedia screen and等を指定し、特定の場合のみプロパティの無 ...

images
可変要素内の文字を丸める

可変の要素内の文字を丸めたかった。いつもであればPHPのmb_strimwidt ...

images
ガラケー(特にdocomo)でのCSS

PCサイトだとIEでつまずくことが多いけど、 ガラケーはdocomoが難儀やよ、 ...

images
CSSで一つの要素に対して複数の背景色を指定する方法

divの要素に対して複数の背景色をつけたかった。background-color ...

images
CSSのopacity

opacityというプロパティを業務中に見かけたのでメモ。 透明度を指定するもの ...

images
Bootstrapを使用したデザインテンプレート

Bootstrapを使用してもデザインのセンス無いし、 と思っていいものはないか ...

images
formのsubmitをボタンを無くしたり画像をつけたりCSSで装飾

aタグになっていたところをsubmitボタンに変えてほしいという修正依頼があった ...

images
CSSでスタイルの優先

1つのファイルに対して複数スタイルが指定されている、 ということがたまにある。 ...

images
CSSでセンターリング

<center></center>でセンターリングが出来 ...