f2c6fe9e169fc19495c3675d3db1f6b6.jpg

自定义问候语和背景色,代码来自某站扒的样式,代码由css加html而成,代码直接复制下面的来用,也可以把css分开问候语如果你喜欢可以不改。

以下为全部代码:

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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<aside id="php\_text-8" class="widget php\_text wow fadeInUp" data-wow-delay="0.3s">
<div class="textwidget widget-text">
<style type="text/css">
#container-box-1 {
color: #526372;
text-transform: uppercase;
width: 100%;
font-size: 16px;
line-height: 50px;
text-align: center
}

#flip-box-1 {
overflow: hidden;
height: 50px
}

#flip-box-1 div {
height: 50px
}

#flip-box-1>div>div {
color: #fff;
display: inline-block;
text-align: center;
height: 50px;
width: 100%
}

#flip-box-1 div:first-child {
animation: show 8s linear infinite
}

.flip-box-1-1 {
background-color: #FF7E40
}

.flip-box-1-2 {
background-color: #C166FF
}

.flip-box-1-3 {
background-color: #737373
}

.flip-box-1-4 {
background-color: #4ec7f3
}

.flip-box-1-5 {
background-color: #42c58a
}

.flip-box-1-6 {
background-color: #F1617D
}

@keyframes show {
0% {
margin-top: -300px
}

5% {
margin-top: -250px
}

16.666% {
margin-top: -250px
}

21.666% {
margin-top: -200px
}

33.332% {
margin-top: -200px
}

38.332% {
margin-top: -150px
}

49.998% {
margin-top: -150px
}

54.998% {
margin-top: -100px
}

66.664% {
margin-top: -100px
}

71.664% {
margin-top: -50px
}

83.33% {
margin-top: -50px
}

88.33% {
margin-top: 0px
}

99.996% {
margin-top: 0px
}

100% {
margin-top: 300px
}
}
</style>
<div id="container-box-1">
<div class="container-box-1-1">坚持每天来逛逛,会让你</div>
<div id="flip-box-1">
<div>
<div class="flip-box-1-1">工作也轻松了!</div>
</div>
<div>
<div class="flip-box-1-2">生活也美好了!</div>
</div>
<div>
<div class="flip-box-1-3">心情也舒畅了!</div>
</div>
<div>
<div class="flip-box-1-4">走路也有劲了!</div>
</div>
<div>
<div class="flip-box-1-5">腿也不痛了!</div>
</div>
<div>
<div class="flip-box-1-6">腰也不酸了!</div>
</div>
<div>
<div class="flip-box-1-1">工作也轻松了!</div>
</div>
</div>
<div class="container-box-1-2">你好我也好,不要忘记哦!</div>
</div>
</div>
<div class="clear"></div>
</aside>