CSS 複数のclass名によるスタイル
HTMLのタグが
<div class="hogehoge panipani">
などのような時、2つ目のように複数のクラスが指定されている場合、CSSで
.hogehoge.panipani{
color:red;
}
と指定すると、複数セレクタが指定された時だけのスタイルを設定できます。
たとえば次の実行結果は、図のようになります。
<head>
<title>無題ドキュメント</title>
<style>
.hogehoge{
color:red;
}
.panipani{
color:blue;
}
.hogehoge.panipani{
color:green
}
</style>
</head>
<body>
<div class="hogehoge">
ほげほげ
</div>
<div class="panipani">
ぱにぱに
</div>
<div class="hogehoge panipani">
ほげほげ ぱにぱに
</div>
</body>
