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

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[新需求] 有谁会看代码

[复制链接]
cao1987 发表于 2020-9-28 22:43:53 | 显示全部楼层 |阅读模式
需求发布
金额范围: 10-50 元
预算金额: 50 元
开始时间:
结束时间:
联系方式: 隐藏内容
  1. <head>
    * G: r- n7 B* o
  2. <style>
    ; K% ?: G# d- Z
  3. .deng-box {
      O+ B' j' s; e' @) Q
  4.         position: fixed;
    . W: |) A1 A3 A& ?  Z5 F
  5.         top: -40px;% K( J+ }3 B5 U/ p& |) D& U
  6.         right: -20px;
    $ J3 K# O  s+ F1 f: _
  7.         z-index: 999;
    : j" {2 p* i* j  C5 h5 J) \
  8. }
    " E' A5 a! B" C4 M

  9. ! \5 S4 j0 I" B" ^
  10. .deng-box1 {/ v8 [4 S7 w8 N' X
  11.         position: fixed;6 N. P. W# s1 p$ q' C
  12.         top: -30px;
    / l& E7 w, M4 ^5 |( J! a3 C3 j
  13.         right: 10px;
    $ U& L3 g0 F4 x7 L- P
  14.         z-index: 999;) L8 ^9 M- I! [. J" {+ v# h
  15. }
    8 n$ ]# v+ L2 l
  16. 1 P; p1 C  d! f0 \/ G' A
  17. .deng-box1 .deng {
    - R" f0 t" T# F% n/ K5 `
  18.         position: relative;2 _/ n8 r' |& n# m) q( j- @4 k
  19.         width: 120px;% Y+ _4 i5 `6 g" ?& N1 F, C, a* b  ^
  20.         height: 90px;2 t: R+ H2 F. @/ k
  21.         margin: 50px;
    8 A0 R+ m( A1 O3 J/ e5 O9 u/ g
  22.         background: #d8000f;; ]6 ?( j) ~+ y5 g/ O0 X# I
  23.         background: rgba(216, 0, 15, 0.8);9 n: i$ [9 a$ j9 M; m
  24.         border-radius: 50% 50%;6 H2 L# l3 l( O# n; d
  25.         -webkit-transform-origin: 50% -100px;
    6 U* U. E7 M% Q% ]$ e
  26.         -webkit-animation: swing 5s infinite ease-in-out;
      A0 _7 d+ {6 F% S" |5 K) @- O
  27.         box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);
    " F- P  Y: o9 H( K0 f7 n
  28. }- }8 \0 `2 `$ x& j* [

  29. - o! w! t( q, O) T/ y% c' }
  30. .deng {
    0 a+ }, Q' M+ _. F5 G! f. K
  31.         position: relative;
    $ \* \0 k& [! d# \
  32.         width: 120px;6 w6 R0 A$ s1 h4 n, W
  33.         height: 90px;9 j! {1 v  e9 ]5 w( B
  34.         margin: 50px;" |4 h# N2 M2 z' ^+ j; G
  35.         background: #d8000f;
    # g4 l$ X8 G% l9 ^, g$ h1 _( W
  36.         background: rgba(216, 0, 15, 0.8);
    / N' P" ]9 N& E& Q. w4 W/ D% ?
  37.         border-radius: 50% 50%;  L3 b$ u. R) a; X! ^
  38.         -webkit-transform-origin: 50% -100px;
    - O& E' a) B4 k* z8 m* N
  39.         -webkit-animation: swing 3s infinite ease-in-out;
    / D+ E' [& T/ p! e
  40.         box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);# x, D2 ~8 ^* i
  41. }- [" |3 }4 N* R' ]
  42. ) O  V+ v  H9 ?/ _
  43. .deng-a {6 Q) @; E0 U2 w
  44.         width: 100px;' a. X/ U6 P8 F7 ~( l1 d, U
  45.         height: 90px;
    9 k5 h, Z3 @& s9 Y3 |
  46.         background: #d8000f;/ o' h7 u9 }# M" Q4 v
  47.         background: rgba(216, 0, 15, 0.1);! o( t# T) W, F7 s5 h% g
  48.         margin: 12px 8px 8px 8px;
    7 W6 i7 B, n/ X* c
  49.         border-radius: 50% 50%;
    7 C! j/ B, r; w
  50.         border: 2px solid #dc8f03;7 L4 P0 p4 G: T) F* x
  51. }
    & \3 e- W  Y4 G$ m; c& L1 Y
  52. 1 X1 i0 {6 t8 }* Q1 K
  53. .deng-b {
    ! ?" u# Y* o- k! x- R& \! {0 W
  54.         width: 45px;) r  m1 g  a6 d- t4 B
  55.         height: 90px;
    8 N2 X3 i! D/ P0 E% W; D) N
  56.         background: #d8000f;
    ( t' H9 b8 C: k1 u9 l5 Y0 N, M6 B( p
  57.         background: rgba(216, 0, 15, 0.1);
    , ?$ Y5 z# P( M* I/ m4 R
  58.         margin: -4px 8px 8px 26px;5 Z1 Q4 V: O3 z% t; L
  59.         border-radius: 50% 50%;
    ( |1 ^2 N7 N# G
  60.         border: 2px solid #dc8f03;# f! Z+ U; D9 W1 }" r% `- n' Q
  61. }
    : l; N+ Q% h: e. P) E' L

  62. . X' ?) h, U; Z1 |, ^: S! O9 W
  63. .xian {
    2 [& J+ \; v, H7 W
  64.         position: absolute;7 k9 `9 I0 r7 p. G3 T* X7 \
  65.         top: -20px;
    / ]- J) x6 t, K
  66.         left: 60px;2 @- W! |. y7 G- V
  67.         width: 2px;
    : m( ?# R) g& u4 [. o5 m
  68.         height: 20px;6 h% {. j' |5 V  j1 r( `/ s
  69.         background: #dc8f03;; K$ E4 H/ ?! |  C; G' X
  70. }
    4 |4 G  b6 L/ `  c6 C
  71. , }: g1 Y2 h! Q* u2 L
  72. .shui-a {0 h5 H3 w! ~! A( c* }
  73.         position: relative;
    + V$ ^1 c$ R/ O
  74.         width: 5px;
    - T6 a# ]# X5 q8 h; }2 \/ V
  75.         height: 20px;
    ; L6 w! T  K+ J, Z! ?6 c
  76.         margin: -5px 0 0 59px;- M# i) f) e0 o% t' i+ |* c
  77.         -webkit-animation: swing 4s infinite ease-in-out;
    9 L* u8 S# D9 d8 m4 n6 N8 ~# l
  78.         -webkit-transform-origin: 50% -45px;
    4 F: K1 Q) s) v- X4 F* h2 Y
  79.         background: #ffa500;( m9 B5 [7 i3 i/ H5 t
  80.         border-radius: 0 0 5px 5px;
      H8 u% E$ L: L5 p5 Z  E) P
  81. }
    4 @9 U4 p, O7 E8 V# p

  82. ' I7 a; }9 B$ s5 D9 \$ m
  83. .shui-b {
    7 D2 E% J% B: R
  84.         position: absolute;
    0 y, Y5 Y5 W# ?2 i$ N  I
  85.         top: 14px;
    + A( k. @# ]/ p* h; z/ W
  86.         left: -2px;% A- F: a2 x$ s7 c4 e* x
  87.         width: 10px;. @& C9 j  M) b% @* f
  88.         height: 10px;
    / H, g9 b3 K1 {- X
  89.         background: #dc8f03;
    * C' W. x9 l# E
  90.         border-radius: 50%;
    8 U/ x! m) |0 ]
  91. }4 N& g1 {- S$ {  w: Q
  92. 9 l. e3 P5 H* i! }1 b  y
  93. .shui-c {
    3 i* g1 C' V2 X. x' X1 L
  94.         position: absolute;0 a8 D, j8 b6 s( q0 X4 V
  95.         top: 18px;5 o( n' a1 m6 I9 X5 Y' n4 W" f' }* K
  96.         left: -2px;
    ) m/ S# a9 {' G+ C' N1 v
  97.         width: 10px;
    ( G2 G* U& _* s0 y/ k
  98.         height: 35px;
    5 C. d" g  a0 b  ~% c; g* `
  99.         background: #ffa500;
    * [3 l/ Z5 L, \5 h6 m  ~
  100.         border-radius: 0 0 0 5px;% ?0 y+ |; [$ q' a% H% t/ h% G
  101. }
    9 u0 O. M3 r5 F1 D1 _

  102. 3 Y& t1 J- s/ t4 z' i
  103. .deng:before {
    ; o- S) f( w9 P8 x9 F
  104.         position: absolute;0 V, }6 {( I8 A' _9 Q' I
  105.         top: -7px;
    ! B# h& D7 k. f) y5 V
  106.         left: 29px;
    # _' [. b" D( v! h+ u
  107.         height: 12px;
    & ^3 S) ~8 T& x1 x
  108.         width: 60px;
    - J$ L! q3 r* B  B# z, d" z
  109.         content: " ";
    * }6 x9 k$ E) a$ i
  110.         display: block;
    ) I) ^. \3 ~+ |
  111.         z-index: 999;7 x( z- n$ Q% j, O- K
  112.         border-radius: 5px 5px 0 0;
    8 x- H* X6 H2 s9 O& F: K
  113.         border: solid 1px #dc8f03;
      X6 I+ I" K, ^
  114.         background: #ffa500;
    $ D4 m8 `4 e! k- f, a3 S
  115.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    4 j3 b" A5 J7 l" q3 I0 I$ \
  116. }
    # t2 ?8 ~/ X, P  |% E4 p7 i; L( E
  117. & P% H" Y, R" i# l
  118. .deng:after {, K( o  [' V/ {$ t* }
  119.         position: absolute;
    . n- O7 D# ?; o9 H: M" |. o3 i+ w
  120.         bottom: -7px;, c: b+ q7 B& N3 A" R
  121.         left: 10px;
    # L. i+ ^( g7 k  ]
  122.         height: 12px;
    $ J! G$ l/ `# N9 |
  123.         width: 60px;) _% S& f$ C# Y& f3 @
  124.         content: " ";
    * Z! D& L4 J) a; f2 e4 s
  125.         display: block;
    5 W& N% r( K1 P
  126.         margin-left: 20px;
    4 m# }5 g6 u7 P5 U) x
  127.         border-radius: 0 0 5px 5px;8 d$ F" C: _* Y, g- Y
  128.         border: solid 1px #dc8f03;
    5 Z1 o' Y0 d" R% k2 `
  129.         background: #ffa500;
    8 i& f0 v0 o; G& W7 i0 q2 s( o
  130.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    ' y$ |& \0 Z5 U- k4 t
  131. }. F! o% W0 j' F% r: S3 o- Q9 Q3 J
  132. 8 ^+ f' M  ^2 ~) K
  133. .deng-t {/ {& h7 h* M7 R& c
  134.         font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;7 e& Z9 g6 f' p+ r- R: m8 H: g
  135.         font-size: 3.2rem;
    4 \- _6 H9 W2 f/ `% n
  136.         color: #dc8f03;
    / s. S4 o" q" ?9 r0 ]! \- g
  137.         font-weight: bold;
    % S6 \- f8 n% N- Q, x0 h( f
  138.         line-height: 85px;. I. I2 P: P+ u( T
  139.         text-align: center;) A8 S. M. N  l6 i7 R5 K8 Z; c
  140. }
    0 g- Y/ {$ S5 i1 m5 p5 v
  141. " m  O" C3 }. V1 w
  142. .night .deng-t, - }% i0 @& E% E" o& J8 C6 \3 l: Q
  143. .night .deng-box, ' j9 U' W4 a0 }; ?6 _# }; z
  144. .night .deng-box1 {. @6 d4 }  y, h9 \  [- h! a( [
  145.         background: transparent !important;4 p6 A8 N9 N! J4 {, L3 j
  146. }
    - j  i7 _: [, b) }& z5 H+ l. c

  147. 3 [# G3 }- v  Q
  148. @-moz-keyframes swing {
    % [7 `# w; s) }# d$ D( O
  149.         0% {
    % b/ I; N2 v5 V8 @
  150.                 -moz-transform: rotate(-10deg)
    ! F# |" t& Q. B: z: H2 a) G* H6 j
  151.         }: h# ]: W# C; G0 x& I  U
  152. " N9 X. W" {$ L' A/ U2 W
  153.         50% {* d! U% L% m! Y  I: M- b
  154.                 -moz-transform: rotate(10deg)
    . o0 N( A$ }3 J
  155.         }9 B% U4 {; Q. E

  156. : ~% J. G/ d! _. L1 q& Y
  157.         100% {# g* [. p. N. \
  158.                 -moz-transform: rotate(-10deg)7 N$ y8 x! K6 a& N! k" c8 O
  159.         }+ j3 S  W% A; r9 X( s( C, h
  160. }" `6 Y! J! m( c( ?  K' j! V
  161. * T- H- E  k7 s; z8 }1 X* ^
  162. @-webkit-keyframes swing {2 G7 U" v6 n7 q7 U
  163.         0% {
    # J. @/ s4 ~2 S, W# a3 h
  164.                 -webkit-transform: rotate(-10deg); K- _7 [5 u% f2 U
  165.         }
    0 _! D/ f6 U4 x# ~7 v3 P0 F! T
  166. 7 H0 N1 s% g* v6 O, V- H4 u1 Q
  167.         50% {
    % o! j$ D9 c% P0 ?' m) v# B" }
  168.                 -webkit-transform: rotate(10deg)
    # j% r% `! H9 r6 L, e
  169.         }
    * b4 Z' `  s% x7 U' d- z# g( \

  170. & p5 l  N* |! ^& Y$ \
  171.         100% {
    . V- F5 P8 z; I* c4 n. [8 Q
  172.                 -webkit-transform: rotate(-10deg)/ R# v; U7 t6 x; U/ q; u% d8 l7 |1 v2 g
  173.         }
    & J& l' N3 ?+ Y
  174. }# Y8 r: @& d4 j
  175. </style>
    * a. x2 J! V7 O6 h; X6 M0 o
  176. <body># q( ?6 c& w7 W4 {
  177. <!-- 灯笼1 -->
    $ [! Q" u& P# B+ R- C
  178. <div class="deng-box">
    ; U- \  r# I, M; S- V4 v7 Q
  179. <div class="deng">$ Y- C( b) O) @  `  ^% B: U* P- Q
  180. <div class="xian"></div>
      b- H, @. p% o$ }; |5 ~" i
  181. <div class="deng-a">! r4 e1 G# _2 E4 j; T
  182. <div class="deng-b"><div class="deng-t">庆</div></div>
    ; d+ S! u+ K+ M* ^' X' Q
  183. </div>5 w5 `/ P& p2 `" Z" D
  184. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>" |) S1 F# r7 p  g. ~  c
  185. </div>
    & u. F6 S% W% t) X! P
  186. </div>
    4 R$ ?& ]* h. x& [, K- C  W
  187. <!-- 灯笼2 -->
    ! S6 [$ ^' M; _6 q7 |1 o
  188. <div class="deng-box1">/ [2 Y6 Y9 J) {/ y' X3 g7 z  C' m
  189. <div class="deng">
    ) r, G7 w7 A  G4 V% N
  190. <div class="xian"></div>
    , J( Q; a+ b% h6 {5 g5 e
  191. <div class="deng-a">
    5 N  L% ?, e4 S' s! f& c
  192. <div class="deng-b"><div class="deng-t">国</div></div>% {% D. H, f. h  l' I. n
  193. </div>
    : @1 s1 N: q9 L+ r1 O
  194. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    % ~1 p+ A. R- q4 c. |, m5 F
  195. </div>) J& S+ V5 h' \  j' L' h
  196. </div>& v/ K7 @0 I' M" Y
  197. </body>
复制代码
上面是两个灯笼在摇摆(示例:www.5gbbs.top),在右边。现在要加两个在左边。该怎么加代码?
$ w) y% y( s; L2 g7 m# H- a1 S) ^* g
cardz! 发表于 2020-9-29 04:10:06 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

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

使用道具 举报

 楼主| cao1987 发表于 2020-10-1 17:50:12 | 显示全部楼层
已经编辑出来了。效果图
4 z- n9 x( \5 r0 {3 H/ v
. n2 d  C4 T* }2 J) D; s

本帖子中包含更多资源

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

x
回复

使用道具 举报

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

本版积分规则

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

GMT+8, 2025-6-7 15:52 , Processed in 0.045158 second(s), 19 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

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