Question

我将图像作为背景，然后是半透明块。我试图使文本像块一样切出来，所以我只能看到文本所在的背景。有帮助吗？

我正在为我的手机（iPhone Cydget）做这件事，并且背景加载为普通的锁屏幕。我只想在背景上放置一个不透明度为0.5的div，并像其中的时钟一样切出（不透明度0，其中数字像素是）。

<html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'></script>
<style>
#hour{
position: absolute;
margin-left: 0;
margin-top: 0;
font-size: 500;
font-weight: 900;
color: rgba(0,0,0,0.1);
text-align: center;
height: 568;
width: 640;
background-color: rgba(0,0,0,0.1)
}
#minute{
position: absolute;
margin-left: 0;
margin-top: 568;
font-size: 500;
font-weight: 900;
color: rgba(0,0,0,0.1);
text-align: center;
height: 568;
width: 640;
background-color: rgba(0,0,0,0.1)
}
</style>
<script type='text/javascript'>
$(document).ready(function(){   
    function timer(){
    var Time = new Date();
    var Minutes = Time.getMinutes();
    var Hours = Time.getHours();
    Minutes = (Minutes < 10 ? "0":"") + Minutes; 
    Hours = (Hours < 10 ? "0":"") + Hours;       
    $("#hour").text(Hours);
    $("#minute").text(Minutes);
    setTimeout(timer, 1000);
    }
    timer();
});
</script>
</head>
<body>
<div>
        <span id="hour"></span>
        <span id="minute"></span>
</div>
</body> 
</html>

Answer 1

假设你有这样的东西

<div id="a_div">text</div>

将此<script>放入<head>

<script>
document.getElementById("a_div").style.opacity = "0.5";
</script>

Answer 2

将文字包裹在一个范围内，以便在css中为其应用样式：

<强> HTML

<div id="bg"><span>semi-transparent text</span></div>

<强> CSS

#bg span { color: rgba(0, 0, 0, 0.5); } //black text with half transparency

如何在休息时看到文字透明？

2 个答案: