<!DOCTYPE html>
<htmlxmlns="http://www.w3.org/1999/xhtml"> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>無標題文檔</title>
<style>
* {
margin: 0px;
padding: 0px;
}
html,
body {
height: 100%;
width: 100%;
}
.index {
height: 100%;
position: relative;
width: 100%;
}
.contain {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}
video {
display: block;
min-height: 100%;
min-width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style>
</head>
<body>
<div class="index">
<div class="contain">
<!-- muted 屬性屬於邏輯屬性,當設置該屬性后，它規定視頻的音頻輸出應該被靜音 -->
<video autoplay="autoplay" loop="loop" muted="muted">
<source src="./top_bg.mp4" type="video/mp4">;
</video>
</div>
</div>
</body>
<script>
</script>
</html>