透明背景效果

兼容几乎所有浏览器的透明背景效果

只愿长相守 提交于 2019-12-10 00:20:24
当今的大部分网页设计都包含了半透明的元素.但用CSS实现想要的效果却没那么简单. 现存的问题 如果我们想要一个半透明背景,有两种实现方式: – 利用CSS和opacity属性 – 建立一个24位PNG背景图片 用opacity的问题除了 需要通过麻烦的语法来兼容所有浏览器 , 还有不单该元素自身背景透明了,它的子元素也会透明. 所以里面所有的文字也是透明的,这一般不是想要的效果. 你可以做一些CSS trick,通过建立额外的元素来解决这个问题,但这种解决方案很恶心. 用PNG的问题是会额外增加HTTP请求, 而且图片比几行css代码要大得多- 尤其考虑到图片不能太小以避免 IE下24位PNG图透明时引起的内存泄漏 . 解决方案 http://fancyoung.com/blog/css-background-transparency/ 来源: oschina 链接: https://my.oschina.net/u/1446867/blog/232726