如何在 html 页面的任意位置添加半透明（半透明）矩形？

Question

我真的很想知道如何在我的页面中间添加一个半透明的矩形而不是覆盖我所有的文字。

我尝试添加白色背景并降低不透明度：

p.a { 浮动：正确；右边距：500px；背景颜色：天蓝色； -moz-不透明度：0.7； -khtml-不透明度：0.7；不透明度：0.7；文本对齐最后； } p.w { 背景颜色：天蓝色； -moz-不透明度：0.7； -khtml-不透明度：0.7；不透明度：0.7；文本对齐最后； }

Answer 1

你试过绝对定位吗？ 这就是您将元素放置在页面中任何位置的方式。 至于不透明度怎么样。

.container {
  height: 100vh;
  background-color: black;
  position: relative;
  
  .rectangle {
    width: 300px;
    height: 200px;
    border: 1px solid yellow;
    background-color: rgba(247,30,28,0.5);//0.5=half
    position: absolute;
    top: 10%;//anywhere you want
    right: 30%; // anywhere you want
      //left & bottom 
    color: white;
  }
}