냥(비교)

.btn {display: inline; border: 1px solid #bbb; border-radius: 5px; padding: 5px 10px; background: #fff}

.btn:hover {background: lab(from #fff calc(l - 2) a b)}

.btn:active {background: lab(from lab(from #fff calc(l - 2) a b) calc(l - 5) a b)}

.content2, .content3 {display: none;}

.btn-active:hover .content1 {display: none;}

.btn-active:hover .content2 {display: block;}

.btn-active:active .content2 {display: none;}

.btn-active:active .content3 {display: block;}

}}}

{{{#!wiki class="btn-active"

{{{#!wiki class="btn"

hover/click}}}

{{{#!wiki class="content1"

content1}}}{{{#!wiki class="content2"

content2}}}{{{#!wiki class="content3"

content3}}}}}}

----

{{{#!style