背景透明時如何為頁面設置默認背景色

Question

我在其中使用以下命令將背景設置為完全透明的頁面：

body {
  background:none transparent!important;
}

這可以按預期工作，我在另一個網站上的透明iframe中顯示此頁面，並且希望通過頁面查看網站背景。

但是，如果我直接訪問該頁面，則背景顯示為白色（一定正確嗎？）

這是硬編碼的瀏覽器，還是有辦法將其設置為黑色？

網站代碼：

<div class="page-background ">
    <div class="header">
      <span>Website menu here</span>
      <span><a href="index.html">Book</a></span>
      <span><a href="about.html">About</a></span>
      <span><a href="contact-us.html">Contact Us</a></span>
    </div>
    <iframe src="http://localhost:4500" allowtransparency="true"></iframe>
  </div>

Answer 1

當您直接訪問時，您的body的父級為html ，背景為白色。 這就是您看到白色背景的原因。 如果要看到黑色，則需要將html設置為黑色背景

 html { background: #000; margin: 0; height: 100%; } body { background: #fff; height: 100%; margin: 0; }

 <button onclick="document.body.style.background = 'transparent';"> Make Transparent </button>

Answer 2

只需創建這三個文件並在background-image屬性中提供圖像鏈接，則第二個文件名應為test2.html，第三個文件名應為test3.html。 然后運行第一個文件，然后單擊book選項。

 <html> <body style="background-image:url('wallpaper2you_462082.jpg');background-size:cover"> <div class="page-background "> <div class="header"> <span>Website menu here</span> <span><a href="test2.html" target="iframe">Book</a></span> <span><a href="about.html">About</a></span> <span><a href="contact-us.html">Contact Us</a></span> </div> <iframe src="test3.html" allowtransparency="true" name="iframe"></iframe> </div> </body> </html>

 <html> <body style='color:white'> <p>Hi</p> <p>How are you?</p> </body> </html>

 <html> <body style='color:red'> <p>Hi</p> <p>How are you?</p> <p>Tell me about yourself.</p> </body> </html>

背景透明時如何為頁面設置默認背景色

問題描述

2 個解決方案

解決方案1
1 2019-07-04 02:15:07

解決方案2
0 2019-07-04 06:33:17

背景透明時如何為頁面設置默認背景色

問題描述

2 個解決方案

解決方案1 1 2019-07-04 02:15:07

解決方案2 0 2019-07-04 06:33:17

解決方案1
1 2019-07-04 02:15:07

解決方案2
0 2019-07-04 06:33:17