mix-blend-mode css属性：
参考文档：https://www.zhangxinxu.com/wordpress/2019/05/css-mix-blend-mode-screen/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>mix-blend-mode</title>
<style>
.friendBg{
display: inline-block;
width: 150px;
height: 267px;
background: url('./images/site-cut.jpg') 0 0 no-repeat;
background-size: 100%;
}
.friendBg-video{
display: block;
mix-blend-mode: screen;
}
</style>
</head>
<body>
<div class="friendBg">
<video class="friendBg-video" src="./images/fire.mp4" width="150" height="267" autoplay="autoplay" preload="auto" loop="loop" webkit-playsinline="true" muted playsinline="true" x5-video-player-type="true" x5-video-orientation="portraint" x5-video-player-fullscreen="true"></video>
</div>
<div style="display:inline-block;width:150px;height:267px;background:url(./images/school_overcast-s.jpg);background-size:100%;"><video width="150" height="267" muted autoplay="autoplay" preload="auto" loop="loop" webkit-playsinline="true" playsinline="true" x5-video-player-type="h5" x5-video-orientation="portraint" x5-video-player-fullscreen="true" src="./images/rains-s.mp4" style="display:block;mix-blend-mode:screen;"></video></div>
</body>
</html>其中要使autoplay生效，得加个muted属性
7123
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
