:hoverとrgba()を使うときの注意点

わからなかった部分/エラーの原因

細かいけど、hoverとopasityでマウスオーバーしたときに背景を半透明に変える方法だけど、 opasityだと文字も一緒に変わってしまう。 そこでrgba()を使うが、色は反映されても半透明にならない。

 

理解したこと/解決手順

parent li:hover{
background-color: rgba(255,255,255,0.5);
}

f:id:shoheimoment:20170916181927p:plain

 


としていたが、「li」と「:」の間に半角スペースが必要。

↓↓↓
parent li :hover{
background-color: rgba(255,255,255,0.5);
}

 

f:id:shoheimoment:20170916181912p:plain