风犬少年的天空视频背景区块 - WordPress 区块

1
  <div id="hero" class="video">
2
    <video muted="muted" autoplay="autoplay" loop="loop">
3
      <source src="https://cdn.getimg.net/npc/2020/file/page/1023/video/video-file.mp4" type="video/mp4">
4
    </video>
5
    <div>
6
      <video autoplay="" loop=""></video>
7
    </div>
8
    <div id="top">
9
      <h2>Npcink
10
      </h2>
11
      <h2>Npcink收录国内外优秀的WordPress、Typecho主题、插件和教程，建站不愁，有我就够
12
      </h2>
13
<p style="font-size: 1px;opacity: 0.5;">那些无法击败我的，终将使我更加强大</p>
14
      <div class="n-annniu">
15
        <a href="https://www.npc.ink/wordpress-page" target="_blank" title="WordPress">
16
          <span class="b2font b2-weixiao-"></span>
17
          Wordpress
18
        </a>
19
        <a href="https://www.npc.ink/typecho-page" target="_blank" title="Typecho">
20
          <span class="b2font b2-biaoqing"></span>
21
          Typecho
22
        </a>
23
      </div>
24
    </div>
25
  </div>
26

27
 <style type="text/css">
28

29
#hero {
30
  position: relative;
31
  background-position: center;
32
  background-size: cover;
33
  background-color: #555;
34
  margin: 0 0 20px;
35
  text-align: center;
36
  transition: 0.8s;
37
}
38

39
#hero.video video {
40
  position: absolute;
41
  min-width: 100%;
42
  min-height: 100%;
43
  top: 50%;
44
  left: 50%;
45
  -webkit-transform: translate(-50%, -50%);
46
  transform: translate(-50%, -50%);
47
}
48

49
/*文本*/
50
#top {
51
  position: relative;
52
  margin: 2em 8em 1em;
53
    padding: 6em 2em;
54
}
55
#top h1,
56
#top h2 {
57
  color: #ffffff;
58
}
59

60
#top h1 {
61
  font-size: 12em;
62
}
63

64
#top h2 {
65
  font-size: 16px;
66
  line-height: 1.8em;
67
font-weight: bolder;
68
}
69

70
/*按钮*/
71
.n-annniu {
72
  text-align: center;
73
  padding-top: 2em;
74
}
75

76
.n-annniu a {
77
  width: 240px;
78
  margin: 0 15px;
79
  display: inline-block;
80
  color: #d33333;
81
  border-radius: 6px;
82
  font-size: 22px;
83
  line-height: 53px;
84
  background: #fff;
85
}
86

87
.home_row_0 .wrapper, .home_row_0 .wrapper .box {
88
    width: 100%!important;
89
    box-shadow: none;
90
}
91
</style>