1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
| /* 去掉全屏时显示的自带控制条 */
| video::-webkit-media-controls{
| display:none !important;
| }
| .wrap h3{
| text-align: center;
| height: 100px;
| line-height: 100px;
| }
| .player{
| width: 720px;
| height: 400px;
| margin: 0 auto;
| position: relative;
|
| }
|
| .player-wrapper {
| width: 900px;
| height: 500px;
| /*overflow-y: auto;*/
| margin: 0 auto;
| text-align: center;
| }
|
| .player .control{
| position: absolute;
| background: rgba(255, 255, 255, 0.3);
| width: 680px;
| height: 40px;
| border-radius: 10px;
| left: 60%;
| bottom: -10px;
| transform: translateX(-48%);
| }
| .player .control div{
| display: inline-block;
| line-height: 40px;
| margin-left: 14px;
| font-size: 18px;
| color: #fff;
| }
| .player .control .play_pause,.player .control .expand{
| color: rgb(246, 255, 249);
| }
| .player .control div:nth-child(2){
| width: 460px;
| height: 10px;
| background-color: rgba(255, 255, 255, 0.5);
| border-radius: 5px;
| overflow: hidden;
| }
| .player .control .progress{
| display: block;
| width: 100%;
| height: 10px;
| background: #fff;
| }
| .player .control .timer{
| font-size: 12px;
| }
|
|
