Html 没有属性“allowtransparency”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3740700/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 04:32:43  来源:igfitidea点击:

There is no attribute "allowtransparency"

htmlcssw3cw3c-validation

提问by Bharanikumar

I am looking for some alternate way to do:

我正在寻找一些替代方法:

<iframe transparency=true   ...

When I do the W3C validation, I am getting the error:

当我进行 W3C 验证时,出现错误:

Column 31: there is no attribute "allowtransparency"

If use this CSS,

如果使用这个 CSS,

.iframe-trans-fix{
   opacity: 0;
   filter:alpha(opacity=0);
}

for the above snippet I am getting a blank iframe.

对于上面的代码片段,我得到了一个空白的 iframe。

采纳答案by james.garriss

While it's true that the W3C's HTML spec does not define it, there is an allowTransparency attribute, and it is supported by all modern browsers (and Internet Explorer). As HTML5has taught us, the cart is supposed to be before the horse.

虽然 W3C 的 HTML 规范确实没有定义它,但有一个 allowTransparency 属性,并且所有现代浏览器(和 Internet Explorer)都支持它。正如HTML5告诉我们的那样,购物车应该在马之前。

Suppose you have this HTML on your main page, index.html:

假设您的主页 index.html 上有这个 HTML:

<html>
    <body>
        <iframe src="source.html" 
                allowTransparency="true" 
                style="background-color:lightgreen;" 
                width="400" height="200">
        </iframe>
    </body>
</html>

And your source.html looks like this:

你的 source.html 看起来像这样:

<html>
    <body>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin gravida, magna
           id bibendum sollicitudin, tellus tortor consequat enim, et mollis mauris 
           augue et dui. </p>
    </body>
</html>

When you open the main page (index.html) in your browser, you will see the text from source.html in an iframe, but it will have a light green background.

当您在浏览器中打开主页 (index.html) 时,您将在 iframe 中看到 source.html 中的文本,但它的背景是浅绿色。

(Tested with Safari, Firefox, and Chrome on Mac OS X and Internet Explorer 8 and Chrome on Windows XP)

(在 Mac OS X 上使用 Safari、Firefox 和 Chrome 以及在 Windows XP 上使用 Internet Explorer 8 和 Chrome 进行测试)

Edit: The key is this: The source page cannot set its own background. If it does, it ignores the transparent background.

编辑:关键是:源页面不能设置自己的背景。如果是,它会忽略透明背景。

Update: Just tested this (March 2019) using Safari 12, Chrome 73, and Firefox 65 on macOS High Sierra, and it still works.

更新:刚刚在 macOS High Sierra 上使用 Safari 12、Chrome 73 和 Firefox 65 对此进行了测试(2019 年 3 月),它仍然有效。

回答by Yi Jiang

I'm not sure what you're trying to do here, but this should be what you are looking for:

我不确定你想在这里做什么,但这应该是你正在寻找的:

iframe {
    background-color: transparent;
}

This is, of course, assuming that you want the background to the iframebe transparent.

当然,这是假设您希望背景iframe透明。

回答by Joe H

There's a way you can do this with jQuery if you have included the jQuery file -

如果您已包含 jQuery 文件,则可以使用 jQuery 来执行此操作 -

<!--[if lt IE 9]><script> $(".classname").attr("allowTransparency", "true"); </script><![endif]-->

Change .classname to that of your iframe or make one if there isn't one. (Take out the attribute from the iframe as well) Put that straight after the iframe closing tag and it adds in the required allowTransparency tag for browsers prior to IE9. As it is within the IE conditional statement, it is not read by the W3C validator. It also eliminates cross browser compatibility and content hiding issues with adding all the CSS that people have already mentioned, if you're using the latest jQuery version anyway. The allowTransparency attribute was created with a clearly defined purpose, so there's no point trying to recreate it with CSS when you can just silently insert it. Hope this helps someone!

将 .classname 更改为 iframe 的名称,如果没有,则创建一个。(也从 iframe 中取出属性)将其直接放在 iframe 结束标记之后,并为 IE9 之前的浏览器添加所需的 allowTransparency 标记。由于它位于 IE 条件语句中,因此 W3C 验证器不会读取它。如果您仍然使用最新的 jQuery 版本,它还可以通过添加人们已经提到的所有 CSS 来消除跨浏览器兼容性和内容隐藏问题。allowTransparency 属性的创建具有明确定义的目的,因此当您可以静默插入它时,尝试使用 CSS 重新创建它是没有意义的。希望这可以帮助某人!

(This method assumes you already haveiframe {background-color:transparent}which doesn't work on older IE versions)

(此方法假设您已经拥有iframe {background-color:transparent}不适用于较旧的 IE 版本)

回答by Dave Everitt

  1. There is no HTML attribute named transparency, so you will alwaysget an error with iframe transparency=true

  2. if you set opacity to zero, you won't see the element at all - you need to define the degree of opacity:

    opacity: 0.25; /* all modern browsers */
    filter: alpha(opacity=25) /* IE */
    
  1. 没有名为 的 HTML 属性transparency,因此您将始终收到错误消息iframe transparency=true

  2. 如果您将不透明度设置为零,您将根本看不到该元素 - 您需要定义不透明度:

    opacity: 0.25; /* all modern browsers */
    filter: alpha(opacity=25) /* IE */
    

The above CSS (note: opacity values are 0-100 for IE, 0-1 for other browsers) will allow other elements behind (e.g. a page background image) to show through, even if the element with the opacity setting has a coloured background.

上面的 CSS(注意:IE 的不透明度值为 0-100,其他浏览器的值为 0-1)将允许后面的其他元素(例如页面背景图像)显示出来,即使具有不透明度设置的元素具有彩色背景.

For more control over transparency, see RGBA (A = alpha), but watch out for variable browser support.

有关透明度的更多控制,请参阅RGBA (A = alpha),但要注意可变浏览器支持。

回答by Andrew

First, there is no such thing as 'transparency="true"', so that won't work.

首先,没有“transparency="true"”这样的东西,所以这是行不通的。

Second, are you trying to make the background transparent or the entire iframe transparent?

其次,你是想让背景透明还是整个 iframe 透明?

The CSS Opacity property makes everything inside whatever element you use it on transparent. Opacity scales from 0 to 1, where 0 is completely see-through, 0.5 is half transparent, and 1 is completely visible.

CSS Opacity 属性使您在任何元素中使用它的所有内容都透明。不透明度从 0 缩放到 1,其中 0 表示完全透明,0.5 表示半透明,1 表示完全可见。

If you use this on a div or an iframe (or anything) the background and the text will all be equally faded.

如果您在 div 或 iframe(或任何东西)上使用它,背景和文本都将同样褪色。

On the other hand, in every modern browser you can set the backround to be partially transparent using RGBA color. You should do it like this:

另一方面,在每个现代浏览器中,您都可以使用 RGBA 颜色将背景设置为部分透明。你应该这样做:

iframe.transparent {
    background-color: #FFF; /*this gives a background color for browsers that can't do RGBA color, like internet explorer*/
    background-color: rgba(255,255,255,0.5);
}

The RGBA color definition works just like the opacity attribute (0 = clear, 1 = solid), except it only makes the specific item you set it on transparent and does not affect the items inside that item (ie it does not affect the text inside your iframe). The first three numbers are the red, green, and blue values of your color on a scale from 0 to 255.

RGBA 颜色定义就像 opacity 属性(0 = 透明,1 = 纯色)一样工作,除了它只会使您将其设置为透明的特定项目而不影响该项目内部的项目(即它不会影响内部的文本你的 iframe)。前三个数字是颜色的红色、绿色和蓝色值,范围从 0 到 255。

If you want a better cross-browser solution, though, I'd recommend just using a transparent .png file as a background image. You'll have to test this on IE, not sure if it will work for an iframe specifically, but you could set no background on the iframe and then set the transparent image as the background of the page you load inside the iframe (apply it to the body element for that page).

但是,如果您想要更好的跨浏览器解决方案,我建议您只使用透明的 .png 文件作为背景图像。您必须在 IE 上对此进行测试,不确定它是否适用于 iframe,但是您可以在 iframe 上不设置背景,然后将透明图像设置为您在 iframe 中加载的页面的背景(应用它到该页面的正文元素)。

Hope this helps!

希望这可以帮助!