[HTML/CSS]classかつclassでセレクタを指定するときの方法（2つ以上複数のclassで指定するとき）
公開日：
:
未分類
WordPrsssを使っているとbodyクラスが大変便利ですが、トップページもその他ページも「固定ページ」で用意していたため以下のようにbodyクラスが付与されていました。
トップページ
<body class=”home page”>
その他のページ
<body class=”page-id-2 page”>
そして、トップページだけレイアウトを変更し、その他のページは同一レイアウトにしたかったのでセレクタclass指定をhome かつ page で、トップページのみにする必要がありました。
このような「classかつclassでセレクタを指定する」場合のスタイルシートの書き方をここにメモしておきます。
//トップページ
.home.page {
}
//その他のページ
.page {
}
これでOKです。
つまり
[classかつclassでセレクタを指定するときの方法（2つ以上複数のclassで指定するとき）]
のまとめは、
class=”aaa” と class=”bbb” があって、
.aaa かつ .bbbで指定したいときは
スタイルシートには
.aaa.bbb {
}
と記述します。
注意するところは、.aaa と .bbb の間にスペースを入れずに記述する点です。
ad
関連記事
-
-
[html/css]検索ボックスをオリジナルの画像で表示させる
デフォルトの検索ボックスといえば・・・ このように味気ないデザインですよね。 やはりサイトの
-
-
[Welcart] 注文完了画面をCSSでカスタマイズする
Welcartをオリジナルテンプレートで作成した場合、注文完了画面が下記図のように「送信が完了しまし
-
-
無料のウイルス対策ソフトMicrosoft Security Essentials (マイクロソフト セキュリティ エッセンシャルズ) を使う
今まで使用していたアンチウイルスソフトの期限が切れてしまい、しばらくウイルスソフトなしで使っていたの
-
-
3.無料で高機能なアクセス解析Google Analytics（アナリティクス）を設置する
完全無料でWordPress（ワードプレス）サイトを作ってアクセス解析やアフェリエイト広告を設置する
-
-
[Welcart]複合検索をチェックしたもの全て表示させる
Welcartの複合検索はデフォルトではチェックしたすべてに当てはまらないとヒットしないようになって
-
-
Adobeのソフトのアイコンが正しく表示されない時の直し方（Photoshop・Illustrator・Flash・Fireworks・Bridge・Extension Manager等）
AdobeのCS6を購入し、インストールしたのですがいくつかのソフトのアイコンが正しく表示されない現
-
-
WordPressテーマ「stinger」にはメタキーワードタグとディスクリプションタグが無い！？
SEOにつよいWordpressテーマ「stinger」には、「meta keyword」、「met
-
-
完全無料でWordPress（ワードプレス）サイトを作ってアクセス解析やアフェリエイト広告を設置する方法
完全に無料でWordPress（ワードプレス）サイトを作る手順を書きます。 目次 グー
-
-
[WordPress]ContactForm7をオリジナルページで表示させる方法
大変便利なプラグインContactForm7ですが、通常の設置方法は の を投稿ページや固定
-
-
[Windows7]ファイル拡張子ごとのアイコンを簡単に変更する方法
Windows7 でファイルを拡張子ごとにアイコンを変えたいときの方法です。 たとえば、txtファ
プロフィール
PR:無料HP
合宿免許 大型
ファクタリング 評判
プログラマー 専門学校
オートエクゼ
中古ホイール 福井
タイヤ パッソ 新品
体育教員 大学
レカロ 中古
ブレスレット
保育士 短期大学
音楽 専門学校 福岡
サニー 日産 中古
名簿屋