arcanum_jp’s blog

おっさんの日記

スタイルシートでスタイルの継承

っぽいことをしたい。Javaだと親クラスを作って継承した子クラスを作る、そして親の属性を持たせたいって事はあるけど、それがスタイルシートでできないのかな?って思っていたが、似た様なことはこんな風にすればいいってイマサラながら思った。


こんなベーススタイルがあって、

.parent {
  border-style: solid;
  border-width: 1px;
}

コレを継承する(属性を同じにする)サブスタイルを作りたい。下のchild1やchild2を使うと、親のparentの属性も付いてくるみたいな・・・

.child1 {
  background-color: red;
}

.chile2 {
  background-color: blue;
}

 この場合、親となるスタイルを定義するときにこんな風にすればいいんだって!

.parent, child1, child2 {
        ~~~~~~~~~~~~~~~~~
  border-style: solid;
  border-width: 1px;
}

いやはや・・・今更ながら・・・