css - Is it possible to set transparency in CSS3 box-shadow? -


Is it possible to set transparency on box shadow?

This is my code:

  Box-Shadow: 10px 10px 10px # 000; -WebKit-Box-Shadow: 10px 10px 10px # 000; -Move box-shadow: 10px 10px 10px # 000;    

I think rgba () will work here . After all, the browser support for both is almost the same.

  / * 50% black box shadow * / box-shadow: 10px 10px 10px RGBA (0, 0, 0, 0.5);  
  div {width: 200px; Height: 50px; Line-height: 50px; Text align: center; White color; Background color: red; Margins: 10px; } Div.a {Box-Shadow: 10px 10px 10px # 000; } Div.b {box-shadow: 10px 10px 10px RGBA (0, 0, 0, 0.5); }   
  & lt; Div class = "a" & gt; 100% black shadow & lt; / Div & gt; & Lt; Div class = "b" & gt; 50% black shadow & lt; / Div & gt;      

Comments