0
我已經將內部div的背景顏色設置爲白色，並將其父div的不透明度設置爲0.6。看來內部div的背景顏色並不完全是白色的。如果我將父div的不透明度更改爲1.0，問題消失了，爲什麼？ http://jsbin.com/zekacunefi/edit?html,output我已將背景顏色設置爲白色，但父元素的不透明度如何影響它？
<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <title>Document</title>
\t <script src="js/jquery.js"></script>
\t <style>
\t \t #msg_container {
\t \t \t position: fixed;
\t \t \t z-index: 3800;
\t \t \t background-color: #000000;
\t \t \t opacity: 0.6;
\t \t \t left: 0;
\t \t \t top: 0;
\t \t \t right: 0;
\t \t \t bottom: 0;
\t \t }
\t \t #modalDialog {
\t \t \t display: inline-block;
\t \t \t z-index: 3801;
\t \t \t background-color: white;
\t \t \t position: absolute;
\t \t \t border: 1px solid rgb(103, 103, 103);
\t \t \t box-shadow: 0 4px 17px 0px rgba(0,0,0,0.4);
\t \t \t top: 50%;
\t \t \t left: 50%;
\t \t }
\t \t body {
\t \t \t background-color: blue;
\t \t }
\t </style>
</head>
<body>
\t
\t <script>
\t \t MessageBox("abc\ndef\ng\nhdasfasdfsdsdfsd");
\t \t function MessageBox(str) {
\t \t \t var boxHtml = "<div id='msg_container'><div id='modalDialog'></div></div>";
\t \t \t $("body").append(boxHtml);
\t \t \t var md = $("#modalDialog");
\t \t \t var contentArray = str.split("\n");
\t \t \t var newArray = contentArray.map(function(ele, idx) {
\t \t \t \t return ele + "<br>";
\t \t \t });
\t \t \t md.html("<p>" + newArray.join("") + "</p>");
\t \t \t var w = md.width(),
\t \t \t h = md.height();
\t \t \t md.css({
\t \t \t \t marginTop: -1 * h/2 + "px",
\t \t \t \t marginLeft: -1 * w/2 + "px"
\t \t \t });
\t \t \t $("#msg_container").appendTo($("body"));
\t \t }
\t </script>
</body>
</html>