大猫咪 发表于 2022-1-20 21:32
终有一日，“这盛世如您所愿”！
为龙你看过呀
马黑黑 发表于 2022-1-20 21:43
为龙你看过呀
为龙之道 吗
马黑黑 发表于 2022-1-20 21:29
CSS的作用。在CSS里，有一个属性可以对背景和背景图片产生透明效果：
opacity: 0.5;
嗯嗯，谢谢啊！
加林森 发表于 2022-1-20 22:08
嗯嗯，谢谢啊！
你要得要领，不然用起来出乱子{:4_170:}
马黑黑 发表于 2022-1-20 22:12
你要得要领，不然用起来出乱子
你麻4我了！{:4_186:}
加林森 发表于 2022-1-20 22:14
你麻4我了！
{:4_170:}
马黑黑 发表于 2022-1-20 22:16
{:4_349:}
这个太美了，透明的处理，让图片有了夜的朦胧，很赞{:4_187:}
有个小疑问，看到你是对图片进行了透明处理，为什么网易云的播放器也跟着半透明了？
只要借用了图片的格式就可以，不用再写一遍代码么？
红影 发表于 2022-1-21 08:53
有个小疑问，看到你是对图片进行了透明处理，为什么网易云的播放器也跟着半透明了？
本帖不是对图片进行透明处理，而是对容器div使用了两个层面的透明处理：
一：div的背景设置为透明 transparent，然后加载一张图片作为背景；
二：div 样式中用 opacity 做透明处理，透明效果起作用的是这个。
网易云iframe播放器具有继承性，它作为 div 的子元素，继承了父亲的opacity透明设置。
红影 发表于 2022-1-21 08:53
只要借用了图片的格式就可以，不用再写一遍代码么？
图片是作为背景图加载的，全部帖子代码如下（为方便理解我将其分行书写并给出注释）：
<style>
#wyfram { /* 网易云播放器：初始为不可见 */
position:relative;
display:none;
}
#papa { /* 父容器 */
position:relative;
left:-240px; /* 左移 - 宽幅必须 */
width:1080px;
height:757px;
background: transparent url('https://638183.freep.cn/638183/Pic/wj.jpg') no-repeat;
opacity:0.8;
}
/* 父容器滑鼠经过：令网易播放器出现 */
#papa:hover #wyfram { display:block; }
</style>
<!-- html代码 -->
<div id="papa">
<iframe id="wyfram" frameborder="no" border="0" marginwidth="0" marginheight="0" width="298" height="52" src="//music.163.com/outchain/player?type=2&id=1889838166&auto=1&height=32"></iframe>
</div>
加林森 发表于 2022-1-20 22:20
{:4_203:}
马黑黑 发表于 2022-1-21 10:51
怎么啦？
马黑黑 发表于 2022-1-21 10:33
本帖不是对图片进行透明处理，而是对容器div使用了两个层面的透明处理：
一：div的背景设置为透明 tra ...
嗯嗯，明白了，是父容器被设置了两个层面的透明处理，和父容器是否加载了图片无关。
而播放器继承的是父容器的设置。黑黑一解说，总算理顺其中的关系了，谢谢{:4_187:}
马黑黑 发表于 2022-1-21 10:45
图片是作为背景图加载的，全部帖子代码如下（为方便理解我将其分行书写并给出注释）：
看到代码里，先设置播放器不可见，然后是父容器，然后是鼠标滑过播放器出现。
想知道，这三块内容可否换位置？变成播放器不可见、鼠标滑过播放器出现、父容器这样的排列？
为方便理解我将其分行书写并给出注释
辛苦黑黑，我的疑问又给你添麻烦了，不好意思啊{:4_173:}
红影 发表于 2022-1-21 11:07
看到代码里，先设置播放器不可见，然后是父容器，然后是鼠标滑过播放器出现。
想知道，这三块内容可否换 ...
没事呀
红影 发表于 2022-1-21 11:02
嗯嗯，明白了，是父容器被设置了两个层面的透明处理，和父容器是否加载了图片无关。
而播放器继承的是父 ...
清晰了吧
马黑黑 发表于 2022-1-20 21:25
应该说是理念糅杂。这没坏处的，你看漂亮的菇凉都是混血的
生物学上的杂交优势
基因交流有利于进化
四海八荒 发表于 2022-1-21 12:04
生物学上的杂交优势
基因交流有利于进化
说的有道理