1

我有一个指向表单的 iframe。该 iframe 在我已设为透明的 css 类中。表单和按钮的字段也是透明的，但我不希望它们是透明的。但是，我确实希望表单的背景保持透明。我的网站位于 avidest.com/zamchick。我该怎么办？这是我的CSS：

.formbox{
  float: right; 
  width: 48%;
  padding-top: 90px; 
  padding-right: 40px;
  background-color:#ffffff;
  border:1px solid black;
  opacity:0.6;
  filter:alpha(opacity=60); /* For IE8 and earlier */
 }

这是带有 iframe 的 html：

  <div class="formbox">
    <script type="text/javascript">
     document.write(unescape("%3Ciframe id=\"fb_iframe\" src=\"testform4.php" 
     + window.location.search + "\" width=\"548\" height=\"787\"allowtransparency=\"true\" scrolling=\"no\" frameborder=\"0\"%3E&lt;a href=\"formio.php\" title=\"formio\"&gt;formio&lt;/a&gt;%3C/iframe%3E"));</script>
    <noscript>
     <iframe width="548" height="787" 
       style="border:none; background:transparent;overflow:hidden;"
     id="fb_iframe" src="testform4/testform4.html">
    &lt;a href="testform4.php" title="testform4"&gt;formio&lt;/a&gt;
    </iframe>
    </noscript>
  </div>

谢谢

4

1 回答 1

1

您可以使用 RGBA 值对其应用透明背景，而不是使整个元素透明：

opacity:0.6;从类中删除.formbox并添加

background-color: rgba(255,255,255,0.6);

前 3 个参数代表 Red、Green 和 Blue 值，而最后一个接受 Alpha 值，范围从 0 到 1。这适用于所有支持 CSS3 的现代浏览器。不过，您可能希望为旧版浏览器提供回退：

   background: rgb(255, 255, 255); /* The Fallback */
   background: rgba(255, 255, 255, 0.6);

如果您想支持真正旧的浏览器，我建议您查看令人惊叹的 Lea Verou 撰写的这篇文章，该文章建议使用半透明的 png 图像和 PHP 脚本来自动化它。

于 2013-03-02T22:07:44.373 回答