【问题标题】:I want to use 'opacity' above a html homepage of my site. Can I use it?我想在我网站的 html 主页上方使用“不透明度”。我可以使用它吗?
【发布时间】:2023-03-23 08:42:01
【问题描述】:

我正在制作一个网站,但我只想显示一个通知(仅在会员打开网站时显示一次)。此通知必须显示在 html 主页的正上方(因为主页可能会因会员而异)。我想用'opacity'在首页上方做一个淡入淡出的页面(这样会员也可以在通知的四个侧面旁边看到主页),我不能使用“alert”,因为通知包含图片、代码和一些额外的功能诸如正面颜色之类的代码。到目前为止,我发现'opacity' 使用了上面的图片,但是我如何在我的网站的 html 主页上方使用'opacity' ???

<html>
<head>
<style>
div.bacgro
  {
  width:500px;
  height:250px;
  background:url of a jpg file;
  border:2px solid black;
  }
div.trabox
  {
  width:400px;
  height:180px;
  margin:30px 50px;
  background-color:#ffffff;
  border:1px solid black;
  opacity:0.6;
  filter:alpha(opacity=60); /* For IE8 and earlier */
  }
div.trabox p
  {
  margin:30px 40px;
  font-weight:bold;
  color:#000000;
  }
</style>
</head>

<body>

<div class="bacgro">
<div class="trabox">
<p>This is some text that is placed in the transparent box. It may contain some code and small profile image also ...
</p>
</div>
</div>

</body>
</html>

但最重要的是,我想将 background:url of a jpg file; 替换为 background:"url of my site's homepage";

【问题讨论】:

  • 你已经尝试了什么?
  • 问题回答了吗?

标签: html css opacity opacitymask


【解决方案1】:

我不太确定你在问什么,但如果你想要一个警报或小消息,你有几个选择。

警报框

<script>
function myFunction() 
{
alert("I am an alert box!");
}
</script>

或者你可以试试这个

 <script language="javascript" type="text/javascript">  
 <!--
 function popitup(url) {
newwindow=window.open(url,'name','height=200,width=150');
if (window.focus) {newwindow.focus()}
return false;
 }

 // -->
 </script>

这是弹出消息的两种常用方法。

【讨论】:

    【解决方案2】:

    如果您的通知只是一张图片,在您的 css 中您可以这样做:

    .yourNoticeId
    {
      opacity:0.4; /* scale 0-1 */
      filter:alpha(opacity=40); /* For IE8 and earlier */
    }
    

    如果它是 div 的一部分

    .yourdiv
    {
       /*r = red color g = green color b = blue color and a = opacity 0-1 scale */
       background: rgba(200, 54, 54, 0.5); 
    }
    

    【讨论】:

    • @Super_user_two这是一个三层页面,第一层或顶层包含通知,第二层或中间层包含淡入淡出页面第三层或最后一层包含我网站的主页(带直播饲料)---这可能吗???
    【解决方案3】:

    使用不透明度的问题是,您的元素或组件将始终存在并占用所需或允许的空间。因此,为了更好的目的,您可以同时使用 display 和 opacity,并且在您的淡入淡出动画之后,将 display 写入 none

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-09-14
      • 2016-10-26
      • 2017-06-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多