开发者

Is there a text-shadow for Divs?

开发者 https://www.devze.com 2022-12-18 11:02 出处:网络
i was wondering if there is something like text-shadow for DIVs, we all 开发者_JS百科know that text-shadow is only for dropping a shadow to the text, but i want a shadow for a complete DIV.

i was wondering if there is something like text-shadow for DIVs, we all 开发者_JS百科know that text-shadow is only for dropping a shadow to the text, but i want a shadow for a complete DIV.

any ideas?

Thanks


If you're using text-shadow you are using CSS3, so try the box-shadow property.


Actually you can do it with css3 on the newer browsers and filters with IE. I read about it in this extremely good article a while back. Basically you can take the following CSS and apply it to a div and it should work with FF, Safari, Chrome, Opera, IE5.5 and up.

.module {
  /* offset left, top, thickness, color with alpha */
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
  /* IE */
  filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray');
  /* slightly different syntax for IE8 */
  -ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray')";
}


You could try border-image

border-image: url(shadow.png);

CSS3 Only though


You can use images to get the shadow effects for divs. Alist apart has nice articles on it.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号