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

用户名  找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[新需求] 有谁会看代码

[复制链接]
cao1987 发表于 2020-9-28 22:43:53 | 显示全部楼层 |阅读模式
需求发布
金额范围: 10-50 元
预算金额: 50 元
开始时间:
结束时间:
联系方式: 隐藏内容
  1. <head>4 [% |6 t, l( {( n
  2. <style>
    . G9 P+ n9 H( c
  3. .deng-box {
    4 j* E) Y3 p: Q7 P% c* U7 Y
  4.         position: fixed;2 \/ c& l0 u4 X# _& w& T
  5.         top: -40px;
    9 `3 G( y5 r2 C; g0 P- t
  6.         right: -20px;9 z0 U0 _+ k6 \" L& O
  7.         z-index: 999;
    3 j; Y) z, D8 u% P$ }
  8. }3 J1 v$ s: m( L/ t; E
  9. # j2 C; y4 X% H3 I4 Z
  10. .deng-box1 {* {' L+ w5 h0 I% m$ Y& }5 E3 W; r
  11.         position: fixed;$ a% {$ c4 W' ^& B5 W; h
  12.         top: -30px;
    $ x! [/ h, p6 ^
  13.         right: 10px;3 C* M# D! s$ ?: j* q! G
  14.         z-index: 999;
    5 d/ n9 Y0 @! p0 B6 U7 I
  15. }
    3 G+ |) d! F" H8 V

  16. + \7 v1 |9 |9 A( c! A7 g* d2 X
  17. .deng-box1 .deng {
    ' a3 }# K1 q$ L  t1 |
  18.         position: relative;; M; w4 K7 c5 [! Y; F( r
  19.         width: 120px;
    ' I% {$ c9 x" q
  20.         height: 90px;  b) i1 I# g; B( w6 ?
  21.         margin: 50px;
    & `7 g* G& ?& F4 n8 O: M5 Y+ `
  22.         background: #d8000f;% K) _+ F0 ]" K. x
  23.         background: rgba(216, 0, 15, 0.8);; `% u) I, r/ w+ k5 n4 V, o1 E
  24.         border-radius: 50% 50%;; H7 a! `" z& ?" L* f/ \+ `5 z
  25.         -webkit-transform-origin: 50% -100px;
    & A' q! Q4 j% F
  26.         -webkit-animation: swing 5s infinite ease-in-out;5 z" U% n- w5 Q9 T, B1 ~6 H: h0 W
  27.         box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);
    & A- |4 r, L/ w" \2 x. r3 \
  28. }
    " E; E. n9 K) l  X" w) `
  29. 0 y" |0 m" H5 w
  30. .deng {
    5 f3 Q1 s/ `  ]- J; v* R, ~( U8 U
  31.         position: relative;
    8 t+ O* D/ r& h) }
  32.         width: 120px;
    ; ~5 W6 V0 |, p# F8 `
  33.         height: 90px;
    6 o6 a" j1 ?  H% l$ _7 V) f' {( w
  34.         margin: 50px;
    . h  H1 L  ]( V5 e$ e' g; k) U
  35.         background: #d8000f;
    ; {# a8 [" _5 i/ K
  36.         background: rgba(216, 0, 15, 0.8);. s3 g) V" ~' r, {
  37.         border-radius: 50% 50%;3 V: d0 M9 v! A' l; ?5 F* t
  38.         -webkit-transform-origin: 50% -100px;
    - ^0 ?4 x; @5 B0 x1 `8 m& w
  39.         -webkit-animation: swing 3s infinite ease-in-out;1 K, c9 T# O% J1 Z, H
  40.         box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);
    ( b& D: ]3 ]$ W8 A% M" P
  41. }
    / s" o3 \4 a; t  ]( d* _5 n

  42. ; ~7 [. W' u" e) I. g
  43. .deng-a {
    : F- r' i  p' ^/ a2 x6 G8 y9 |
  44.         width: 100px;
    - d: d3 o5 O, z! ^7 b
  45.         height: 90px;6 S( W+ P2 w7 M3 t
  46.         background: #d8000f;8 @6 ^& ]. f. W( O' x. m5 |4 A
  47.         background: rgba(216, 0, 15, 0.1);- w9 D$ H% W4 k- }
  48.         margin: 12px 8px 8px 8px;- p/ F# W) P5 d! I+ e
  49.         border-radius: 50% 50%;. H. J$ i# g9 q, G9 R
  50.         border: 2px solid #dc8f03;" x0 Z1 H' T0 W4 b! u4 |, I
  51. }
    3 X. _: W5 C/ l8 q

  52. % ^) {0 f' e. D, U
  53. .deng-b {5 P6 I, L- e. Q+ l1 I# z( E# ]. r
  54.         width: 45px;
    ( k1 p. D8 ~$ P9 ?# y! _9 K
  55.         height: 90px;8 ]8 ]0 P7 \% d% V; w& U$ a3 s1 r
  56.         background: #d8000f;6 Y) \. w4 K/ b
  57.         background: rgba(216, 0, 15, 0.1);
    0 w; Y* u% R( m9 u
  58.         margin: -4px 8px 8px 26px;
    6 B* e3 u% W! Q1 [# E
  59.         border-radius: 50% 50%;
      I; a, I) z$ `4 [, `
  60.         border: 2px solid #dc8f03;
    8 W5 I/ t4 {8 @$ M
  61. }/ i' O6 h, F% ~

  62. 7 `' h. G" u8 K
  63. .xian {8 L" A$ n0 M3 V! k6 ~7 W. r
  64.         position: absolute;0 n  E2 ?1 X' d0 I* r9 P( j/ ^* M! j0 B
  65.         top: -20px;1 h2 u. B- o, F  k8 x
  66.         left: 60px;
    . p- e) q& S" I
  67.         width: 2px;
    - p: a- `1 P) b: B3 c, Z0 o
  68.         height: 20px;
    . D  F% W9 Z# M& k
  69.         background: #dc8f03;& j/ ]8 f+ x9 b& T2 q: h6 @
  70. }
    : O% b3 N$ f; X: m/ e

  71. / w! ~. ~5 F$ `) _6 w( v% w( L- J
  72. .shui-a {3 r" {3 U+ j: ?, H$ Y
  73.         position: relative;
    0 z5 O* u0 I) t- y% j
  74.         width: 5px;
    8 h; p9 d* a, [# _# C
  75.         height: 20px;, F6 T+ K, \2 ]* u* N! T
  76.         margin: -5px 0 0 59px;! g  ?! a) m/ S9 g( M
  77.         -webkit-animation: swing 4s infinite ease-in-out;: F+ b8 N) C+ j- ~: M8 s
  78.         -webkit-transform-origin: 50% -45px;6 c, b+ G# P" |5 q' `2 z
  79.         background: #ffa500;
    5 |! e, z8 ?1 _, `- z
  80.         border-radius: 0 0 5px 5px;* S8 l$ S' p; E
  81. }
    , |, R6 X4 B/ V7 `
  82. 4 I$ B6 V1 f# [* G
  83. .shui-b {2 U! M; O; D) |6 k
  84.         position: absolute;- c, ?: X( i' p$ r8 s! t3 ?
  85.         top: 14px;3 p" X# P/ C9 Z9 ]1 [* ]3 M
  86.         left: -2px;  N! x% Y- J* Y1 A
  87.         width: 10px;6 ^; @' z: t9 ]
  88.         height: 10px;; P2 ^, |- U7 {* I
  89.         background: #dc8f03;
    : y0 {; h7 `/ e! J- J3 o: t* r
  90.         border-radius: 50%;
    ! i5 ?0 E7 r* ^8 G# s
  91. }
    " E' {2 n' Z7 @4 ?" @% J" O3 N& ]
  92. 6 ]* V* C6 y$ Q
  93. .shui-c {
    , \! F# y7 \- L* L% m4 p
  94.         position: absolute;# h$ f" e" {& J+ N& u* b
  95.         top: 18px;
    4 t/ b, y- j# y' B/ I, B
  96.         left: -2px;  u, I' {* V8 z: Q  u# g
  97.         width: 10px;
    + X0 p) N- `# C, F2 W& s
  98.         height: 35px;4 R+ G- R( q. S  r2 X- V3 W" s. {5 f
  99.         background: #ffa500;
    8 o- J% |9 A' X9 v& d7 x  z* K8 u
  100.         border-radius: 0 0 0 5px;
    " F0 A' ]7 V( i' t
  101. }
    ! D6 m" b, E2 \8 ]& q! ]; b% q

  102. ' m! N8 }& V- V* G) R& m: Q
  103. .deng:before {7 q0 T7 y0 W$ y  o" b% t5 V
  104.         position: absolute;
    6 k" k: O- F% X+ `  @" G, f+ e, I
  105.         top: -7px;
    - r& {' a, x& n- x. j- y& q
  106.         left: 29px;: y3 C( g7 |% n4 d
  107.         height: 12px;
    ! f0 q; V" ?3 o4 `; y: F5 w) H, x7 Q% }
  108.         width: 60px;: s/ L7 |8 }* i) k0 x& P
  109.         content: " ";
    0 i) d& ?) {' d' ]6 D9 r* r9 k/ \- e
  110.         display: block;
    0 s( `  Q1 Q+ w- N5 ~. p& E( x
  111.         z-index: 999;; y, X# h* M3 b/ J1 C5 d
  112.         border-radius: 5px 5px 0 0;) v( t4 G  D7 @$ G
  113.         border: solid 1px #dc8f03;. y$ O3 S) p3 |
  114.         background: #ffa500;
    " E& X& k* D8 y6 c' B9 U. [' ]
  115.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    7 p2 c/ }% |) X' r+ U
  116. }0 A* g* g& O2 l, c# c; k

  117. & p/ H' v+ H( r) g+ u: o8 R
  118. .deng:after {
    3 U% e& S7 T# A, c1 \* K% T3 i3 O  X
  119.         position: absolute;
    4 a2 ^5 N2 D9 ]( C' ^: r
  120.         bottom: -7px;6 s$ A( W- X$ E9 {' f1 O! O# y
  121.         left: 10px;
    / Q( v" a/ x1 N9 m' |
  122.         height: 12px;
    . \" M, H' u) ]( y# E
  123.         width: 60px;
    2 C+ N7 J2 W" q8 _* @
  124.         content: " ";9 O' s  P, q( d" `8 Z: j0 I
  125.         display: block;
    * B( s6 x. K0 g$ X
  126.         margin-left: 20px;
    4 \. F4 e! W* @4 ], t) X6 k: _
  127.         border-radius: 0 0 5px 5px;
    8 V0 w" {1 K7 i
  128.         border: solid 1px #dc8f03;4 f3 y  g: |; U; h: P) J5 w
  129.         background: #ffa500;; g' \" N2 E) N/ r2 E0 K3 J' [
  130.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    / E- G3 u( Y+ C5 P* c4 f, k
  131. }
    " r5 w4 C3 F' j' u: F/ j6 f

  132. 6 s) e$ g$ C8 I' l% w9 z, k
  133. .deng-t {* m# X+ D# O* O# }+ G
  134.         font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;
    6 c6 V5 U! R- ^7 x! n# j
  135.         font-size: 3.2rem;9 b+ U& s, J+ J& m7 t% |2 r5 Y
  136.         color: #dc8f03;# ^( T. b7 O" i. p
  137.         font-weight: bold;
    2 _" R$ o7 Q8 ?, n5 e0 h$ ^( x
  138.         line-height: 85px;
    " e; Z2 E7 _+ g7 T0 ]2 |& _* E
  139.         text-align: center;
    - k. t' c; g& y
  140. }& s7 \& A, J4 _9 E1 @
  141. ! `! t6 p. g' L
  142. .night .deng-t,
    ! A4 {" o! v4 f: S, w7 I0 F
  143. .night .deng-box,
    ; P% O* V  ?' g+ L# G4 r" W
  144. .night .deng-box1 {
    ! o! W+ I5 S- C8 _0 L9 S/ X! K
  145.         background: transparent !important;
    3 m: M% j3 o% V  `  U
  146. }
    6 q, ~  M/ K: Q8 O3 A  ?2 M
  147. 1 ?/ z% c% ^" W2 Y  W
  148. @-moz-keyframes swing {1 n+ c+ u' p" Y; ^
  149.         0% {' x# w3 I8 `0 }, m! x9 d  I/ e
  150.                 -moz-transform: rotate(-10deg)
    + l7 p1 N, }+ J
  151.         }
    5 d/ f8 w5 [4 I
  152. ) r/ j4 S0 f9 l& h$ d6 t
  153.         50% {
    1 l7 U% U/ E' |9 j/ D% ^& I( |
  154.                 -moz-transform: rotate(10deg)+ h% U- Z7 k: |# u0 m8 o
  155.         }" w( L9 B5 g  [/ L* T0 w
  156. & Q" }0 G' @: J; w* ?
  157.         100% {
    * g% t) k+ P% a; M0 R% A$ d
  158.                 -moz-transform: rotate(-10deg)0 c8 {; t9 q% o: j$ b( v! Z
  159.         }
    6 d7 B. t- ^. t" z& {! r! N' a, S
  160. }! Z, f1 j  x3 h, R9 q  B( S/ p
  161. 5 h4 [, X; K% b7 G2 E6 t
  162. @-webkit-keyframes swing {; F/ ^2 V# m2 L+ }( T: J6 N6 v
  163.         0% {
    4 b) n& L- e+ N1 I( l3 ]- T
  164.                 -webkit-transform: rotate(-10deg)! P( C0 H" |9 j/ q6 C, b; o
  165.         }7 W* g, @% V+ e7 l

  166. 6 R* }$ V2 k4 O3 V$ l
  167.         50% {# U9 _: Z, H( f! |
  168.                 -webkit-transform: rotate(10deg)
    # ]7 v% R8 @' N' K7 ~1 m: V
  169.         }
    ( y0 [2 P3 H5 `

  170. + F7 q' b* Y$ a# v& l# Y! ?
  171.         100% {
    % S7 c( ?- }# A- w1 E1 g
  172.                 -webkit-transform: rotate(-10deg)
    $ [) }. @% e0 e/ U
  173.         }
    7 f8 v2 }4 Z% J  D2 ^/ G
  174. }
    ( D8 U( m" w( g% k
  175. </style>
    1 D! }# P3 x% H! X# s0 t
  176. <body>& J# G* U. E: |, O  c1 d/ V. w; `
  177. <!-- 灯笼1 -->
    . X( x* z( F6 ~3 `* `4 d0 |
  178. <div class="deng-box">* E8 K% c) y9 R8 [% Y, b; U
  179. <div class="deng">
    ' T' i' T; g, }" D9 Q+ W
  180. <div class="xian"></div>( r/ o- x/ B$ \  X# T  h3 c
  181. <div class="deng-a">+ s4 c, @' o3 A- F0 y  W
  182. <div class="deng-b"><div class="deng-t">庆</div></div>
    ' j: l. c7 X  q: r0 k
  183. </div>
    1 |+ w% [' ^* W4 o# B
  184. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    8 I" `+ Y/ p! @! l2 I2 K
  185. </div>( n! @1 f4 c- Y" R% u9 Z* w
  186. </div>0 j: M6 N/ W+ k  f) w
  187. <!-- 灯笼2 -->
    ( @* Q+ N0 c/ w" b3 N
  188. <div class="deng-box1">
    / T5 A9 A9 i: N6 F, Y% _7 Y( |
  189. <div class="deng">3 o+ E- ~* @( ~  c3 i: @
  190. <div class="xian"></div>8 F# ?9 [% K, }
  191. <div class="deng-a">
    ! B! s) V2 h& I' Y
  192. <div class="deng-b"><div class="deng-t">国</div></div>
    $ W' e/ L3 ^4 f+ c; x
  193. </div>8 e, i2 [: w! }6 O# y
  194. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>+ F7 c1 j/ l" i/ @- d, B  X
  195. </div>
    8 [4 `+ {# R3 G- x/ `$ R
  196. </div>
    7 G1 U& i5 p  ]6 b- O9 S- W% L
  197. </body>
复制代码
上面是两个灯笼在摇摆(示例:www.5gbbs.top),在右边。现在要加两个在左边。该怎么加代码?% ]* r% h$ `2 m0 [& {# o- @

/ P7 |2 N8 o# }: ~
cardz! 发表于 2020-9-29 04:10:06 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

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

使用道具 举报

 楼主| cao1987 发表于 2020-10-1 17:50:12 | 显示全部楼层
已经编辑出来了。效果图, F! k* Z4 r2 [, ^8 T8 g# Q; v$ a
3 H) ~. O( r1 v% T

本帖子中包含更多资源

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

x
回复

使用道具 举报

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

本版积分规则

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

GMT+8, 2025-4-8 19:52 , Processed in 0.046311 second(s), 19 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

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