html css里设置div为50%透明,为div里面的img添加opacity:1;不透明,但显示的结果img也是透明的,

html-css07

html css里设置div为50%透明,为div里面的img添加opacity:1;不透明,但显示的结果img也是透明的,,第1张

你外面的DIV都透明了。那么他包含的所有元素都是透明的。你可以这么做

<div style="position:relative">

<div style="opactiy:.5position:absulotleft:0top:0width:100%height:100">这是你要透明的DIV</div>

<img src="" style="position:absulotleft:0top:0width:100%height:100">/><!--这个是不透明的-->

</div>

当然这种方式一点都不理想

最好的方式当然是设置

外面这个DIV 背景“色”为透明。而不是他本身透明rgba(134, 62, 62, 0.39)

如果是图片就是第一种方式。

filter:alpha(opacit=0,finishopacity=100,style=1,startx=0,starty=85,finishx=150,finishy=85)}

opacity 写错了

透明 只要 filter:alpha(opacity=50)就够了 这个只在ie中有效果

其他浏览器还需要这样写 opacity: 0.5

什么是浏览器兼容?在我们的实际开发中会涉及到在多个浏览器比如 firefox,opera,chrome,或者IE的多个版本下进行调试,在不同版本浏览器下会出现显示效果不一的情况,而浏览器兼容就是为了处理这种情况。 浏览器最重要核心的部分是“浏览器内核”,负责对网页语法的解释(如标准通用标记语言下的一个应用HTML、JavaScript)并渲染(显示)网页。 所以,通常所谓的浏览器内核也就是浏览器所采用的渲染引擎,渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。主要浏览器内核有哪些? 1、Trident内核代表产品Internet Explorer2、Gecko内核代表产品Firefox3、WebKit内核代表作品Safari    主要用于Mac OS系统4、Presto内核代表作品Opera5、Blink由Google和Opera Software开发的浏览器排版引擎1.因为历史原因,不同的浏览器样式存在差异,可以通过 Normalize.css 抹平差异,也可以定制自己的 reset.css,例如通过通配符选择器,全局重置样式 2.在CSS3还没有成为真正的标准时,浏览器厂商就开始支持这些属性的使用了。CSS3样式语法还存在波动时,浏览器厂商提供了针对浏览器的前缀,直到现在还是有部分的属性需要加上浏览器前缀。在开发过程中我们一般通过IDE开发插件、css 预处理器以及前端自动化构建工程帮我们处理。 3.在还原设计稿的时候我们常常会需要用到透明属性,所以解决 IE9 以下浏览器不能使用 opacit。1.事件兼容的问题,我们通常需要会封装一个适配器的方法,过滤事件句柄绑定、移除、冒泡阻止以及默认事件行为处理 2.new Date()构造函数使用,'2018-07-05'是无法被各个浏览器中,使用new Date(str)来正确生成日期对象的。 正确的用法是'2018/07/05'. 3获取 scrollTop 通过 document.documentElement.scrollTop 兼容非chrome浏览器1.快速判断 IE 浏览器版本<!--[if IE 8]>ie8 <![endif]--> 2.判断是否是 Safari 浏览器/* Safari */var isSafari = /a/.__proto__=='//' 3.判断是否是 Chrome 浏览器/* Chrome */var isChrome = Boolean(window.chrome)