这是来源:
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<title>White</title>
<style>
body {
background-color: black;
}
.quadrant-legend {
position: absolute;
left : 28px;
width : 288px;
height : 62px;
}
.quadrant-legend-img {
position: absolute;
top : 0;
left : 0;
z-index : 3;
}
.quadrant-legend-btn {
position: absolute;
top : 6px;
right : 34px;
z-index : 3;
}
.quadrant-legend-text {
margin-left: 16px;
margin-top : 16px;
font-family: arial, sans-serif;
font-size : 26px;
color : white;
z-index : 4;
}
#quadrant-legend-asset {
top: 60px;
z-index: 4;
}
</style>
</head>
<body>
<div id="quadrant-legend-asset" class="quadrant-legend">
<img class="quadrant-legend-img" src="images/quadrant-bg.svg" />
<img class="quadrant-legend-btn" src="images/quadrant-asset-btn.svg" />
<p class="quadrant-legend-text">lightblue text</p>
</div>
<p class="quadrant-legend-text">white text</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
结果,由Firefox或Chrome显示
问题是:为什么白色文字变成浅蓝色?
注意:我添加了一些z-indexCSS指令而没有任何影响.