Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[新需求] 有谁会看代码

[复制链接]
cao1987 发表于 2020-9-28 22:43:53 | 显示全部楼层 |阅读模式
需求发布
金额范围: 10-50 元
预算金额: 50 元
开始时间:
结束时间:
联系方式: 隐藏内容
  1. <head>
    2 Z1 p  P6 [6 w& e
  2. <style>
    ( H) N) W, l- C' D! v
  3. .deng-box {
    0 I& e& i) M) i
  4.         position: fixed;
    , m& T3 w) W7 t- w
  5.         top: -40px;) R- }( z! x% {" P
  6.         right: -20px;* c. p: z5 b) ]" _
  7.         z-index: 999;
    5 I) Y$ }+ Q) a0 P
  8. }, v& f0 P. f& a
  9. 4 K/ Z, ]" D4 V5 O; `
  10. .deng-box1 {- G) K3 W5 v/ q  f
  11.         position: fixed;
    5 z5 H; o0 Z. f1 I0 e2 l( p% o
  12.         top: -30px;' y" [) v' q# y) R- X
  13.         right: 10px;
    * Z# [- y( c" B
  14.         z-index: 999;1 W0 r6 G: n& V7 N. S' y
  15. }0 y+ \( Q8 v& S8 k

  16. 6 S, r# i# J  W+ l3 u3 |# i. c5 ~2 O
  17. .deng-box1 .deng {/ _; e1 {, m) O9 m2 R/ w
  18.         position: relative;& b/ A9 h) q, @
  19.         width: 120px;
      ~6 o7 ~& T  U% ?7 d' H  y
  20.         height: 90px;; c! y2 Z4 F, c6 a
  21.         margin: 50px;$ M* P2 q5 v" e+ M7 S( ]8 P& X8 D( o
  22.         background: #d8000f;
    + u6 B8 e( k! {, r. g) I$ X. S
  23.         background: rgba(216, 0, 15, 0.8);
    & [9 _1 Q' m/ i
  24.         border-radius: 50% 50%;0 c* P" `% B/ q7 B
  25.         -webkit-transform-origin: 50% -100px;
    7 s3 T+ [" _) r$ C) p
  26.         -webkit-animation: swing 5s infinite ease-in-out;' X  @$ i! N% ~( M4 o
  27.         box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);! g8 M% _$ ?  K- u5 h
  28. }5 S% J4 P5 k. _" P2 U' l

  29. " o6 x4 z4 n- \" E1 D: l/ Y) ^
  30. .deng {
    ! B, w/ F* [& [0 r
  31.         position: relative;
    ' ?, J- k; M% d  K' r' W; \) d
  32.         width: 120px;
    : A+ F( b6 X: @
  33.         height: 90px;
    6 B* }% |" T% Z' P
  34.         margin: 50px;; c* V3 ]  B2 e
  35.         background: #d8000f;
    , N7 ^9 `8 W; `4 y. u; B
  36.         background: rgba(216, 0, 15, 0.8);9 m4 j9 l- Y( M4 P8 n5 [
  37.         border-radius: 50% 50%;' k8 e8 n1 g" L1 u0 w
  38.         -webkit-transform-origin: 50% -100px;
    7 U6 \1 C$ g; t9 r0 Z
  39.         -webkit-animation: swing 3s infinite ease-in-out;: o2 R' q# a$ W5 W9 t
  40.         box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);
    8 x0 @1 H, C6 n! O2 r. I: x0 |
  41. }
    & z. B9 F. s0 `: H' V
  42. 8 k2 f9 `8 f) O' r. m( }
  43. .deng-a {
    6 I( k0 x! D( b. m  _+ ~( _
  44.         width: 100px;' V" C6 @3 p9 D& z
  45.         height: 90px;4 Q! {$ C" K- h; w8 c- x/ i
  46.         background: #d8000f;+ Y$ y$ V* F# w/ n. [
  47.         background: rgba(216, 0, 15, 0.1);& N4 N- }9 V" r+ N* J
  48.         margin: 12px 8px 8px 8px;# q& B7 M6 A7 I- J) E) G
  49.         border-radius: 50% 50%;2 ~1 U  h; c5 o2 e9 _9 T
  50.         border: 2px solid #dc8f03;1 e% \3 e% `6 ?( j7 e2 }+ U$ s2 ^  z
  51. }
    5 Q' u4 {3 E$ B, s

  52. + V6 G) L, |+ L  M6 F
  53. .deng-b {
    9 X) B0 o/ z( B, _# i" Y9 u
  54.         width: 45px;. s4 Q- l- y6 g
  55.         height: 90px;
    3 p" w, L+ o4 _+ j3 x
  56.         background: #d8000f;
    3 ]1 l/ c& \' Q. b! c! U2 X$ X) ]
  57.         background: rgba(216, 0, 15, 0.1);
    . G6 r" K" P% K+ Y* S
  58.         margin: -4px 8px 8px 26px;% K7 A5 h; N; @
  59.         border-radius: 50% 50%;" W0 B# A5 H7 b$ C& Y, A1 }
  60.         border: 2px solid #dc8f03;
    3 o$ X; Q+ |' ^' O+ d
  61. }
    0 x6 l  M3 I- q* [/ W' _) G/ U

  62. / m" U3 @6 y$ j8 R1 J/ ~; C5 q' y# N
  63. .xian {' B; `$ L7 T3 z: f2 I
  64.         position: absolute;
    # K+ R" b' x; p) w
  65.         top: -20px;  D/ D8 V  r2 W, m) M" H& O& s* R
  66.         left: 60px;( B; Z$ g3 g8 [+ i
  67.         width: 2px;% g$ o. O+ \! U  J  g( C; ^: L8 x
  68.         height: 20px;$ t% O# g' ]( Z7 D4 L
  69.         background: #dc8f03;
    7 ^7 U+ _1 S3 F: q& m4 U
  70. }
    . D! e: }) L7 k; d8 k
  71.   Z' Q0 g3 N- K+ g# _9 \
  72. .shui-a {
    % z: Q. y2 ?+ |# H, \
  73.         position: relative;) k6 i+ i- p1 h+ g7 W% e
  74.         width: 5px;
    2 Q' R, E, V+ B2 F6 ~
  75.         height: 20px;- P! y* {& a$ W2 N2 s: E
  76.         margin: -5px 0 0 59px;
      @# c( s. Z, f
  77.         -webkit-animation: swing 4s infinite ease-in-out;
    * B' U4 C" l) b; G+ b- e( K
  78.         -webkit-transform-origin: 50% -45px;
    1 |$ u3 I# I2 `, C2 ^8 {
  79.         background: #ffa500;
    3 y% _2 X  {4 t7 m+ V* ~& E
  80.         border-radius: 0 0 5px 5px;
    * R9 T+ p* @( k0 L
  81. }
    5 u" F3 [9 K! U) e

  82. 4 s/ l/ z; F) h( |1 }' S
  83. .shui-b {9 V1 l. |8 {7 y, R& z
  84.         position: absolute;* {/ \1 n) O! K; Y, Y' B
  85.         top: 14px;% ?6 e2 G8 W& a$ d( N" O+ d0 ?
  86.         left: -2px;
    ) g$ e, |2 i* K! `1 }: s/ `% `
  87.         width: 10px;
    # ~* S" f% U# v( c/ P
  88.         height: 10px;' ?( ~* Y$ U3 l
  89.         background: #dc8f03;" J' m& O9 ~; ^5 M* n" A0 o7 \  l
  90.         border-radius: 50%;
    $ N6 ?" s2 s6 t! e6 I0 R
  91. }; r4 e; u- X0 ]( I6 [! {  P7 z) r+ f
  92. 9 |* Y" v) J( o/ v' o* E$ N& M+ |
  93. .shui-c {9 x$ [+ F6 k. f7 @+ q: s
  94.         position: absolute;* @( `/ _. w0 W' E7 ^* t$ t
  95.         top: 18px;
    + e' F  E3 x6 I: N0 {% `, B" M/ s0 z
  96.         left: -2px;9 V6 i0 P' s0 R1 N
  97.         width: 10px;
    0 W2 G' v$ V- K* F
  98.         height: 35px;' `6 I7 Y3 m" Q& w0 U
  99.         background: #ffa500;# J3 S$ l; V4 S0 x
  100.         border-radius: 0 0 0 5px;6 B; ?7 H; d" w
  101. }
    & i2 ^" V# K8 h$ |2 b6 P" S

  102. - R. S1 }3 l; G! k* d
  103. .deng:before {
    ' t0 j6 k" g& {; `0 e
  104.         position: absolute;
    ! Y; R6 }% Y  T! t+ j% m* C
  105.         top: -7px;: ~7 O  n1 Q$ F% z. Y7 z& Y+ B
  106.         left: 29px;
    ) Z0 A0 V* M% P  G8 x6 `5 @
  107.         height: 12px;- R+ f2 H) L( I( G
  108.         width: 60px;4 r% U: W: }; V
  109.         content: " ";
    8 q4 J" b  N% A  V' F) _
  110.         display: block;
    & w- y- y: N% Y# }$ H
  111.         z-index: 999;
    $ ~. W* Y- `" l$ I' y- m
  112.         border-radius: 5px 5px 0 0;
    ( D, m3 \- T2 Z, K; T- r
  113.         border: solid 1px #dc8f03;
    , E8 D* q4 d) c# w1 }
  114.         background: #ffa500;
    0 k% ^( B) E2 q8 g' B. i# R! j
  115.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    8 u0 `7 i: z: Q' [5 {  I
  116. }$ N( N) J- j$ r, i% x
  117. ( b" ~3 K0 j( e' U' ~2 Z5 y
  118. .deng:after {
    : D) k0 B) @8 n
  119.         position: absolute;7 W8 ?9 m% y" I9 @5 q
  120.         bottom: -7px;
    8 ?; M3 v3 u9 m# i3 m2 C
  121.         left: 10px;
    ) Z/ u: M6 B$ B8 G
  122.         height: 12px;
    ' l, A" ^; e. g  k
  123.         width: 60px;
    : @! V% ?( V! ^# `4 }
  124.         content: " ";$ U1 S% t3 ^$ Z7 M+ A. o
  125.         display: block;
    . D8 C, J$ h- K' I1 Y
  126.         margin-left: 20px;8 S6 R* {+ p% d
  127.         border-radius: 0 0 5px 5px;9 ?/ z2 Z8 c  n8 M4 J
  128.         border: solid 1px #dc8f03;
    ; v; V$ q0 d! e3 n$ q4 s0 u
  129.         background: #ffa500;" D* L6 I  ~0 @: O8 `5 L
  130.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    5 `- ~/ ~/ Q% d) S0 d) B
  131. }
    ; Q7 G/ ~( V4 ]9 M

  132. - D( K; y6 C* l$ G
  133. .deng-t {
    - z/ E- |' ^9 d, d. M* U/ w" A
  134.         font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;
    $ G: ]4 ?- }/ M- b
  135.         font-size: 3.2rem;2 C( Q2 J2 e; v1 b
  136.         color: #dc8f03;% Z; s3 W  T$ }& j7 U5 l9 R2 z
  137.         font-weight: bold;1 {. B2 i+ [& j9 r+ N( [
  138.         line-height: 85px;% T! U6 B8 a# K- {! |6 y
  139.         text-align: center;" l$ D/ ]) t' P1 Q1 }6 l
  140. }/ H% L0 W5 m  ?  N) E( T# q  {5 r4 P
  141. ) e4 N0 z1 Z$ C/ Z! c  ]8 b/ z
  142. .night .deng-t,
    % ^  P8 j& \' R. k' t
  143. .night .deng-box,
    & o/ ?1 P! C7 d' \. t2 O
  144. .night .deng-box1 {
    $ p" j/ g4 m4 ]/ U
  145.         background: transparent !important;4 C" O, f) k/ b) L9 a% ^3 i& c) @
  146. }5 ]5 J7 ?% D; s5 K
  147. 6 I! {3 M* M) F
  148. @-moz-keyframes swing {
    $ Z+ x5 q" V4 L, k7 Q
  149.         0% {- E% e) b- G8 b$ j: B
  150.                 -moz-transform: rotate(-10deg)
    ; ~3 t9 ]& g) |
  151.         }" t+ M4 t$ H% X' ?/ m  [

  152. : z: I/ k3 s  `0 }5 m! ^
  153.         50% {
    7 m7 I4 x* z% C, F* U
  154.                 -moz-transform: rotate(10deg)4 h3 C4 j$ ^7 W* p
  155.         }
    * E4 |) p1 h3 W$ {% G0 E- Y. x
  156. : I  Q1 c* G- n& o" |- f
  157.         100% {
    , i2 [7 x+ @6 p6 e4 r2 t
  158.                 -moz-transform: rotate(-10deg)' K2 Y; x( d4 A: c
  159.         }5 G, }: n( f0 K/ \4 i+ |
  160. }
    0 o6 Z# m5 a% F

  161. / r; l+ s9 Q- x6 O% s' n2 o1 i6 y
  162. @-webkit-keyframes swing {
    4 B) H0 z  s9 O: y  V; P$ X4 X5 d! b
  163.         0% {: T/ [8 J! V. T8 {6 `
  164.                 -webkit-transform: rotate(-10deg)
    # m; l( K8 i8 Q- {, H
  165.         }
    * h+ Z, J6 g8 z+ z, G6 U
  166. / _% K' r6 ?/ ]' G( C
  167.         50% {
    " v( r6 O  T1 B6 J( t
  168.                 -webkit-transform: rotate(10deg)0 }" H9 K. [8 B! _1 z6 t
  169.         }, X0 T5 E: b/ T. X! a3 W- M% V
  170. 3 q& T' e1 N! W& n8 ~1 m2 ~: |
  171.         100% {
    : z' O, |9 ?8 D/ I
  172.                 -webkit-transform: rotate(-10deg)
    # e: d: Y6 ~1 G0 k+ [, \
  173.         }1 ^" B6 ^' O8 r, m7 G- h
  174. }# y+ i3 Y' L  C- M
  175. </style>
    8 N! P6 i) s: h% y9 ^
  176. <body>. H; u' j/ z! F" }8 W
  177. <!-- 灯笼1 -->- p2 W5 ~. B" x$ K: a2 j6 J
  178. <div class="deng-box">
    + M; K+ a9 ]' G: W2 f- {4 c- G
  179. <div class="deng">
    / }: M5 H6 |. [6 L7 \' Y" N
  180. <div class="xian"></div>
    ; @) t/ k* K& W0 r; M
  181. <div class="deng-a">+ W8 M! o  W6 ~; _, f9 e
  182. <div class="deng-b"><div class="deng-t">庆</div></div>4 F) R$ ~2 k9 C5 l* H' V
  183. </div>
    5 b! {  m$ N; A* S0 ~
  184. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    3 S0 T6 G8 S2 }( I2 z" U+ Z; G
  185. </div>  A/ X6 Y7 m' j1 h+ b
  186. </div>
    ) }. N3 ?; t' ?
  187. <!-- 灯笼2 -->" h2 o9 e, K6 ^
  188. <div class="deng-box1">- s0 L+ R* C0 w' m7 m2 U9 [$ b# u/ J
  189. <div class="deng">
    0 F. |' B# P' t/ l) A# e/ S
  190. <div class="xian"></div>
    4 v: Y% @1 ?- W! ]5 M: [) o
  191. <div class="deng-a">+ L) u2 ]* h) X/ s8 B
  192. <div class="deng-b"><div class="deng-t">国</div></div>" t5 B1 h/ z& y5 e
  193. </div>
    7 \: T3 F7 y+ p& j6 I  f
  194. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    : n, L9 \, q6 K7 F; u- {
  195. </div>
    3 u2 l5 W/ M; V8 J, V
  196. </div>
    7 _+ d3 w% e/ @9 i$ |8 c+ O
  197. </body>
复制代码
上面是两个灯笼在摇摆(示例:www.5gbbs.top),在右边。现在要加两个在左边。该怎么加代码?
, Q) I+ w  w9 J) I0 ~- y: R
) V& R+ ^  s1 M9 E" S8 Z2 \/ h
cardz! 发表于 2020-9-29 04:10:06 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

59id 发表于 2020-9-29 10:39:27 | 显示全部楼层
为了搞这么个没用的东西  加那么多代码影响网站访问速度  自己又还不会 我觉得你还是算了吧
回复

使用道具 举报

 楼主| cao1987 发表于 2020-10-1 17:50:12 | 显示全部楼层
已经编辑出来了。效果图0 b/ z8 v) o; Y) Y2 E: c. q( e1 o, b& X

: ?  v2 i! k$ @; |2 \

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2025-4-4 00:33 , Processed in 0.048205 second(s), 19 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表