设为首页收藏本站
切换到宽版

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

 找回密码
 立即注册
搜索
Discuz!官方免费开源建站系统»论坛 › Discuz! 交流与讨论 › 站长帮 › 有谁会看代码
返回列表 发新帖

[新需求] 有谁会看代码

[复制链接]
cao1987 发表于 2020-9-28 22:43:53 | 显示全部楼层 |阅读模式
需求发布
金额范围: 10-50 元
预算金额: 50 元
开始时间:
结束时间:
联系方式: 隐藏内容
  1. <head>& s1 a3 ]# \* c2 L2 L/ U
  2. <style>1 t8 T2 m% R( J: `1 \$ F' H3 ^7 {  t
  3. .deng-box {$ j' T# [$ @/ b  [0 k5 a
  4.         position: fixed;
    5 u4 B- Y) n& C6 O7 e5 n! @4 A2 g
  5.         top: -40px;, i: f2 V+ W: }: L/ T
  6.         right: -20px;
    : s& @4 U' B& s' P
  7.         z-index: 999;
    7 i- O# g7 K6 T
  8. }; O$ M. Z" G8 X! I+ e. w# Q9 d

  9. 1 X8 q. m& }% a, L" `
  10. .deng-box1 {
    4 p; Z7 h( p) w4 V  D! ~
  11.         position: fixed;& x4 E2 E6 |( T5 Z/ |) \& M
  12.         top: -30px;& W1 f/ \' n# A; D1 z; X
  13.         right: 10px;
    3 D3 e8 L8 T1 ]' }# ~
  14.         z-index: 999;/ t, a+ R4 ]; @1 @4 c* a
  15. }2 p3 @# h" q( o4 `! h- @

  16. 8 {9 p, E- ?) D, `9 ^  o
  17. .deng-box1 .deng {3 ]; ?6 }6 v; M8 o' X3 o
  18.         position: relative;; x2 k' B% _# |+ z
  19.         width: 120px;8 n) U! W6 e9 `
  20.         height: 90px;
    $ y$ l3 i9 }, d. s/ M; S* e' k/ }
  21.         margin: 50px;4 i& K+ w3 @$ z. Z
  22.         background: #d8000f;4 K. a  c) w/ c' O' g
  23.         background: rgba(216, 0, 15, 0.8);$ p4 O! q( y3 D; H% K4 S5 F
  24.         border-radius: 50% 50%;: T" r) m& }. b7 ~* y! Z. r
  25.         -webkit-transform-origin: 50% -100px;" {/ B8 n4 @) v
  26.         -webkit-animation: swing 5s infinite ease-in-out;
    ) d3 M' \* ?* s3 M  H% S3 V* V; \
  27.         box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);
    " y5 B3 K' a/ o: A
  28. }2 X6 z1 n0 t! p7 f0 L
  29. ; z7 a( w: `$ m5 x
  30. .deng {
    ! I+ B/ j* ~; M
  31.         position: relative;
    9 ?" i% `$ v4 a9 _
  32.         width: 120px;9 [7 _& {0 O: E- O* @  B) {
  33.         height: 90px;
    $ q( e6 R$ c8 H$ R( R
  34.         margin: 50px;
    3 Y" r6 ?: s* W7 q
  35.         background: #d8000f;
    9 {# ~. q# F: G" i5 R1 i6 m
  36.         background: rgba(216, 0, 15, 0.8);
    8 Y& X) {, J, ?2 E7 @5 ~3 ~
  37.         border-radius: 50% 50%;0 B( ^% ]3 g8 b# }8 t6 D5 J
  38.         -webkit-transform-origin: 50% -100px;5 k( c" }$ R  `% y
  39.         -webkit-animation: swing 3s infinite ease-in-out;
    & s0 f( l3 J- j" s- ^+ R: h
  40.         box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);
    / `- ~3 A( q+ C! v# V
  41. }
    $ A6 R% E4 g; `

  42. 4 L7 X3 a2 D  q9 y% A
  43. .deng-a {& O0 [" \+ P6 n$ p, g% O
  44.         width: 100px;
    - m- w3 D6 s* j/ S& h+ Y" h, u
  45.         height: 90px;; D6 w+ [+ p$ B& ~5 Y
  46.         background: #d8000f;( d* b2 C9 F- E2 X
  47.         background: rgba(216, 0, 15, 0.1);: b$ L! D# K/ m# }- U
  48.         margin: 12px 8px 8px 8px;
    8 w7 P; [  y. H3 ^* M) {
  49.         border-radius: 50% 50%;* E! D. a+ o- a& g8 t1 ]. T! d! l: ]
  50.         border: 2px solid #dc8f03;
      Y! K2 m& f/ r  G0 k. p# w* t
  51. }+ ?0 t* s0 U7 \% S0 c1 c% T

  52. & s+ S. s5 Q, w. z+ o( |
  53. .deng-b {
    . ^; b! x  j4 @. p
  54.         width: 45px;: h9 n: _# n. z) `3 m2 M* u
  55.         height: 90px;$ ]3 J* y' X  n- ~9 q
  56.         background: #d8000f;% X& _; h# l" c* l, q
  57.         background: rgba(216, 0, 15, 0.1);" P9 \( q5 H& S. z+ L8 m( e
  58.         margin: -4px 8px 8px 26px;$ s3 M2 p; z! p% J$ H' l
  59.         border-radius: 50% 50%;
    & a  f+ I8 j1 D+ R1 T% E  ^
  60.         border: 2px solid #dc8f03;
    * F. p5 A2 P! J4 I3 j
  61. }
    % |3 i  y$ Z/ c4 g' z% Q

  62. , `+ ~% d& o2 D7 U9 W+ ]$ `1 c
  63. .xian {
    ! A) ^. C. T. a. s' a  T4 j# e
  64.         position: absolute;  u) B0 R' M+ Y5 ?
  65.         top: -20px;* S5 L+ j3 Q7 J. n
  66.         left: 60px;3 o3 K9 r& ~  G* f
  67.         width: 2px;
    * c8 R8 R% y7 T1 m
  68.         height: 20px;
    ( y) B8 P+ n5 T* ~
  69.         background: #dc8f03;
    ! G& ~2 ]4 S6 _, u, d
  70. }8 m# w. @$ _$ c4 |; C( f5 l
  71. # S6 Z5 k, H# F4 b1 o1 K' r- p4 X
  72. .shui-a {
    + b3 k/ V8 }2 ~  b
  73.         position: relative;
    * u) T) Y  b9 j' A2 f
  74.         width: 5px;
    ' m) d% B9 S* r- S2 i
  75.         height: 20px;
    2 f7 U  d& D' ?3 U! I0 |
  76.         margin: -5px 0 0 59px;
    6 p, _9 V. A. Y+ y3 \& E
  77.         -webkit-animation: swing 4s infinite ease-in-out;
    / ?( H/ E( K' D  b9 B
  78.         -webkit-transform-origin: 50% -45px;
    0 A! |! h: H; O
  79.         background: #ffa500;
    6 u# z+ e4 G* f4 v; n6 }
  80.         border-radius: 0 0 5px 5px;4 {2 h6 M/ Y6 y: g$ k
  81. }+ S/ \9 U2 }( e# T

  82. ) w3 ^+ U: e! i" C" A7 w1 D7 \; T
  83. .shui-b {% b* `1 b. l- |
  84.         position: absolute;
    $ c3 }8 d  l+ T% L: T- g/ Z
  85.         top: 14px;
    & Q% @! f  q* v# Q* @7 E
  86.         left: -2px;
    , m+ \( i4 @5 l; Z* D
  87.         width: 10px;  W" H6 g2 \3 g8 l& N! H
  88.         height: 10px;
    * ]" p) ?! W2 l$ y4 d0 s/ U! R+ l
  89.         background: #dc8f03;
    5 Y: k& ?8 M. j0 ~- \9 a- S
  90.         border-radius: 50%;
    6 d5 ^! e' w5 Y1 h( A; V: f
  91. }
    * T/ f9 g$ B! n- {

  92. * ^4 h# e% i: q6 i3 E4 X
  93. .shui-c {
    " k2 A4 o7 G1 d2 Q8 e. c
  94.         position: absolute;5 e7 P! B* L$ f. ]2 g; ?
  95.         top: 18px;
      x0 i3 a+ B8 o# m, t
  96.         left: -2px;
    6 T& g- J) K  s& u' w* X* b4 Z
  97.         width: 10px;
    3 c% r9 r! d( N& N0 u" ~8 J2 B
  98.         height: 35px;1 Q6 A% x9 ^3 x7 J3 v3 v
  99.         background: #ffa500;
    , X5 {& \; z8 T; m! }% A. o7 C
  100.         border-radius: 0 0 0 5px;
    ' `7 y6 P. z  r, D4 |; `
  101. }% Q' r) A2 y: M; L9 ^0 N6 c
  102. / p/ o" V, R6 ]$ W
  103. .deng:before {
      K; B- w) {  j" P* H8 L
  104.         position: absolute;, u4 ~5 [, k; m: O+ c  Q
  105.         top: -7px;
    2 B) Q+ A$ Z0 V- Z0 V) p
  106.         left: 29px;. J$ x% f8 q) W  S
  107.         height: 12px;
    : k+ x% h9 A& r( x7 W
  108.         width: 60px;8 u$ e) k2 u; p5 y* m" q' z
  109.         content: " ";
    & @% ~! D  W- _3 Z
  110.         display: block;
    7 p( K1 W' i  B: D
  111.         z-index: 999;% r2 ]+ D, @$ ~- F8 _! }( X' A: |
  112.         border-radius: 5px 5px 0 0;
    4 c+ l1 Q, x4 G( ]
  113.         border: solid 1px #dc8f03;* F7 d  ^+ B9 ?7 _
  114.         background: #ffa500;: a' H, [! I) e- h4 u
  115.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);
    % ]! X) \' T) F: _
  116. }0 q  `( [; m0 M% L& c

  117. $ u. r4 D$ r) f9 Y, U6 @
  118. .deng:after {
    . C0 P) k' Y& i* t6 y
  119.         position: absolute;
    " Q" {0 q$ x5 p8 k
  120.         bottom: -7px;
    . q! {: S" X4 E
  121.         left: 10px;& F5 L2 t- N6 u5 G4 m0 ]
  122.         height: 12px;4 ^. j; B2 N9 _; j8 L5 g
  123.         width: 60px;
    7 `: q6 x( C, D0 n: ]1 |8 h
  124.         content: " ";) X6 x# U! @& h# W3 d: D; j
  125.         display: block;% e! `2 T& h1 x& D5 K
  126.         margin-left: 20px;
    $ V6 ^, a  p. f) O( x
  127.         border-radius: 0 0 5px 5px;, z/ F! U, O6 N- x, d3 c0 D
  128.         border: solid 1px #dc8f03;9 I7 l$ i! e% ]9 w
  129.         background: #ffa500;
    ' i5 N0 F) ?$ w8 c3 @* M+ A
  130.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);0 S, h; h) q+ V. p% ~6 ~0 f
  131. }
    5 z" m3 @0 J% ]- D' j

  132. 0 q. P* L+ y9 n6 ?% i
  133. .deng-t {
    " j- z% R$ t8 [5 @7 c) h
  134.         font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;# U4 b% e  k7 n6 X: b! c
  135.         font-size: 3.2rem;
    - u& k2 j" M6 W3 }1 I: ~& j7 H' v4 b
  136.         color: #dc8f03;
    9 c! x5 M; Q; w, R
  137.         font-weight: bold;
    ( d+ F. h2 r2 [% [  n+ Z7 f6 \" g, H' }
  138.         line-height: 85px;
    : y/ S) @# c; a; w, H2 _
  139.         text-align: center;
    % |4 i1 P: A; t# t
  140. }9 S9 H2 @- I6 H2 e0 f
  141. 3 E+ q- b3 t2 N& W  e  [: N
  142. .night .deng-t, $ a1 E$ Z$ e* {7 B. T6 x, m
  143. .night .deng-box, 6 l* s5 M, k" K: z. v  \
  144. .night .deng-box1 {
    - c" c$ a" U- `# i% e
  145.         background: transparent !important;
    " z: A) _2 h/ h5 N- n2 Q
  146. }
    6 X; K/ E3 @, q  N3 i
  147. 9 y6 m) u0 q7 x
  148. @-moz-keyframes swing {" \6 A2 ~( j' o/ {. f
  149.         0% {
    5 ?) c% i5 F3 n
  150.                 -moz-transform: rotate(-10deg)  a1 P: u2 ]! A  B) F" c
  151.         }
    . Z) q; {8 C) _# U
  152. - l/ p* B! j$ i2 o
  153.         50% {8 u' `2 C; v& |0 d/ Q3 ^
  154.                 -moz-transform: rotate(10deg)% K  A: k% v% j1 V* `) u5 h
  155.         }+ P" ?) u2 K0 Y4 c2 x/ i

  156. : w& X* `- y: }! ]
  157.         100% {
    & s3 }1 A) u& `* }
  158.                 -moz-transform: rotate(-10deg)" i" q& Z- m! ]  G, m
  159.         }
      E5 C0 u& O8 y7 f3 L9 f
  160. }5 a6 Y$ O' F: [! A+ g( u7 m

  161. 8 k4 [3 \  B5 ~) K5 q) |
  162. @-webkit-keyframes swing {. l0 V- G- A3 ?. d! E
  163.         0% {& ?" c6 j' [: ~8 [$ ]( ^
  164.                 -webkit-transform: rotate(-10deg)/ L9 p, e+ J8 |( X6 \. r! ~2 t
  165.         }4 F* g( M0 n6 D. R8 j4 ^2 f8 R" t3 M+ C% ?

  166. ) H- e  N8 ^  Z) T* H
  167.         50% {& i& M3 @; m7 d; Y1 f# o
  168.                 -webkit-transform: rotate(10deg)
    6 }. c$ c2 l+ c0 ~2 y% I2 `
  169.         }
    , e+ T1 C/ @1 K; W4 }* g

  170. ( |! x1 x& g6 \# \+ _( A9 {: \
  171.         100% {
    9 G! z1 O  d% N  E( m- f4 l& H& ~
  172.                 -webkit-transform: rotate(-10deg)
    5 A! _$ s3 R5 s8 w% E1 b; F9 S
  173.         }
    " q( W4 _" O% |4 f# }5 R! s6 l) d
  174. }
    0 J$ h1 X3 ?9 Z
  175. </style>0 O5 c( B! y( s
  176. <body>
    # ]' b+ n% o9 Y$ \- @4 J4 |
  177. <!-- 灯笼1 -->
    8 S( l' z8 b6 t0 O2 z' ~9 D" Q) ]
  178. <div class="deng-box">. q: Y0 K& s( r" K" @
  179. <div class="deng">0 O4 r2 N" v6 s- K
  180. <div class="xian"></div>; B/ g, [2 f; S  S6 M! z
  181. <div class="deng-a">
    . M! y' y& h7 m( z8 K$ Z
  182. <div class="deng-b"><div class="deng-t">庆</div></div>6 M. G# \- j9 X% q
  183. </div>
    " m. s6 k7 E. ]+ F8 \$ F9 w7 Z- {! D
  184. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>2 C" g$ o! M' O: X
  185. </div>
    9 f" _* v* }. R/ {8 M1 A. w
  186. </div>
    5 H, _, y, p, m8 L9 G
  187. <!-- 灯笼2 -->
    " m' ]! k" f/ T1 D2 k
  188. <div class="deng-box1">. c; Y$ H: K! c# ^4 n# M& [; n
  189. <div class="deng">+ Z% ]9 X" y4 z
  190. <div class="xian"></div>
    6 |+ z9 l% }; g0 l5 p5 n, k6 r4 m
  191. <div class="deng-a">7 Z& s. n7 T5 L  i
  192. <div class="deng-b"><div class="deng-t">国</div></div>
    5 q: g" d6 R# d% f/ k% {
  193. </div>
    6 t) F1 S  O( |! G$ B) W
  194. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    7 L% w, C. _, U4 J( m4 F( o
  195. </div>9 b  y: k; H$ k! x" s8 ^) v; D1 z
  196. </div>9 w4 c0 z9 Q  h( q; r7 s/ x
  197. </body>
复制代码
上面是两个灯笼在摇摆(示例：www.5gbbs.top），在右边。现在要加两个在左边。该怎么加代码？) y* m& m6 S1 a% O7 C/ _$ ?  O
! ~; y6 @( T5 g5 ^# ^9 C0 a
回复

使用道具 举报

cardz! 发表于 2020-9-29 04:10:06 | 显示全部楼层
我Q3160510998
回复

使用道具 举报

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

使用道具 举报

 楼主| cao1987 发表于 2020-10-1 17:50:12 | 显示全部楼层
已经编辑出来了。效果图. w2 r5 x7 o2 Y% I, H8 ]
% a* o: H3 R; y/ n4 H

本帖子中包含更多资源

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

x
回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2025-8-24 10:35 , Processed in 0.153031 second(s), 17 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

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