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

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

 找回密码
 立即注册

QQ登录

只需一步，快速开始

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

[新需求] 有谁会看代码

[复制链接]
cao1987 发表于 2020-9-28 22:43:53 | 显示全部楼层 |阅读模式
需求发布
金额范围: 10-50 元
预算金额: 50 元
开始时间:
结束时间:
联系方式: 隐藏内容
  1. <head>0 g- W  u, D% D# X- _+ h
  2. <style>
    * t, _( {0 y/ r4 r$ Y. N! J
  3. .deng-box {
    # \5 M4 ~6 C5 s  s9 h
  4.         position: fixed;
    ( f4 f7 d2 Y/ D; C7 A
  5.         top: -40px;
    1 s- D1 G6 T3 _6 t
  6.         right: -20px;
      v- ^' F3 V: n+ o) g
  7.         z-index: 999;" c4 ^1 P9 v! k; }' p' J; N
  8. }6 O; w( |4 }) L* C' C! N. k

  9. 1 Z+ |2 ^- h" k( |. s! S. \
  10. .deng-box1 {
    1 v# K# O6 _" U) r9 G
  11.         position: fixed;
    1 {' q" D8 _& c- ^& _* o# `
  12.         top: -30px;: \8 ]7 Z, A% {6 f4 H8 M* A
  13.         right: 10px;
    6 u& U9 i+ p, D  E
  14.         z-index: 999;
    7 u6 l" O6 i$ `, Y$ S7 m7 f
  15. }
    1 j$ S  {( [1 t0 V) c- w6 N

  16. 5 U2 Z! @3 P$ |6 |; i4 v! [
  17. .deng-box1 .deng {
    0 H  P. x8 h7 S8 W2 S" C$ }
  18.         position: relative;
    + H0 Y/ s* ~( y6 [0 {& I7 }) A& J
  19.         width: 120px;
    3 t7 p; G' X4 T7 K
  20.         height: 90px;
      F: E  r# d5 Q+ c, t$ E
  21.         margin: 50px;
    2 T& B$ ?* V2 Z
  22.         background: #d8000f;
    - J/ L7 K0 e) I% e4 I! ~$ T
  23.         background: rgba(216, 0, 15, 0.8);( R: J. A8 N5 w% A
  24.         border-radius: 50% 50%;
    / r/ N, k. P7 m' e5 [* `
  25.         -webkit-transform-origin: 50% -100px;
    0 M3 ?/ |7 S8 t% d8 V* \
  26.         -webkit-animation: swing 5s infinite ease-in-out;5 u0 y/ E* J9 M  B7 A3 Q
  27.         box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1);0 v) {; q: L4 o
  28. }8 x! A7 O  B- P8 B( L
  29. 1 j9 o/ P# [& b9 I( {
  30. .deng {5 e2 r5 N: I* x" ^( E. D9 A3 t
  31.         position: relative;
    ! T7 c4 i' K) p  M; X5 l1 L
  32.         width: 120px;' [# Z) m7 E. V) y/ \+ o
  33.         height: 90px;7 U$ k- m. u( ]+ K1 h
  34.         margin: 50px;" o! M8 a, p& \" s& B
  35.         background: #d8000f;1 x: }6 [! [+ s% j
  36.         background: rgba(216, 0, 15, 0.8);: B2 F" P% }' Y: O
  37.         border-radius: 50% 50%;3 L' O3 M* a2 ^8 n4 k* ]5 _
  38.         -webkit-transform-origin: 50% -100px;2 \. k' l, p" s% J- t" w
  39.         -webkit-animation: swing 3s infinite ease-in-out;
    % M/ Y# _! F1 e! P' L
  40.         box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1);9 t1 B) I: N1 b, t: a" P; E
  41. }# |1 x3 d+ o& M2 r, v# q1 {  ^
  42. ' }7 z. X* n1 z+ k
  43. .deng-a {
    3 N0 ~7 \6 z8 w& _" v( q- J* E
  44.         width: 100px;
    8 O$ T3 B" U" L. j
  45.         height: 90px;
    + P5 [1 U4 i6 x0 K4 s3 w/ Z
  46.         background: #d8000f;
    . p1 n; f0 y' Z( |- s5 w! t
  47.         background: rgba(216, 0, 15, 0.1);0 ~, d, u" y# f1 F  Q0 G
  48.         margin: 12px 8px 8px 8px;
    ; {% T3 ~( e: {+ ~# d1 i
  49.         border-radius: 50% 50%;
    ! P( y3 d- H) J
  50.         border: 2px solid #dc8f03;
    - m9 ]) J$ k* r
  51. }9 w. z! K8 l% R8 k

  52. 4 z6 @! F" A; {
  53. .deng-b {6 p! ^7 }3 M+ r0 x: V1 D6 [
  54.         width: 45px;- F7 v% V: i7 W: q7 c
  55.         height: 90px;0 l- x: w' F: k' l% L
  56.         background: #d8000f;
    + a- a  J, B; S. f4 h8 |2 c
  57.         background: rgba(216, 0, 15, 0.1);3 c9 x- `' X4 b8 F; M
  58.         margin: -4px 8px 8px 26px;' S( K( a& {% r  Y3 |: b  K% p: d% Q
  59.         border-radius: 50% 50%;* U; j+ z1 {8 Y8 s- `9 v9 [1 m8 n( w
  60.         border: 2px solid #dc8f03;
    5 l9 ^# m1 K; K1 R# H
  61. }
      f6 h  V/ L: J" }6 p
  62. # w2 S, {* r$ Y- }
  63. .xian {
    7 T2 j8 W' F* q) A: @0 v
  64.         position: absolute;
    + r( y6 Z3 u( F$ A
  65.         top: -20px;
    4 Q; ~' m0 c& J, ~! z# U# w
  66.         left: 60px;. C, q) G3 [$ v8 l/ m1 B
  67.         width: 2px;
    6 C9 v% Z/ k2 L; y% \- q2 I
  68.         height: 20px;( N, [7 ?7 p( `! q6 p
  69.         background: #dc8f03;
    / [7 i5 M! r0 n( F- I+ a( c2 d$ @
  70. }
    . a2 ^0 J/ f% f8 ]% H( Z% B5 {
  71. 7 W% a- ^% n1 Z5 A! p
  72. .shui-a {$ j  x( h* p2 _: t; z, c5 A
  73.         position: relative;  @* x" M/ M" u4 d6 U; F5 }4 x
  74.         width: 5px;; h% S% B! o5 t
  75.         height: 20px;+ S9 g) A1 V0 e$ I1 q. x6 O( _; }
  76.         margin: -5px 0 0 59px;# o: K; w) G0 f- z
  77.         -webkit-animation: swing 4s infinite ease-in-out;9 a, {1 i6 _0 k: J6 h- w
  78.         -webkit-transform-origin: 50% -45px;8 m: v( \8 j: e# Y* q# w7 ]6 s
  79.         background: #ffa500;1 K; g1 `4 S3 ]8 J/ F
  80.         border-radius: 0 0 5px 5px;$ \% g: s5 ?) f3 ?
  81. }  l: e9 {6 J/ F6 n0 Y

  82. % h! B  C# x2 B# J' r+ q7 E
  83. .shui-b {
    : h, p8 J$ w$ r/ g/ ^. n
  84.         position: absolute;/ X# s% b5 e0 I2 J
  85.         top: 14px;
    ) ]* T' r, D' X, {6 O2 e
  86.         left: -2px;
    ( q+ A4 p( Y& o. C- Q% R
  87.         width: 10px;
    6 `5 w) a6 Z  o
  88.         height: 10px;( {2 V! `5 ^; V4 u; P$ N. d
  89.         background: #dc8f03;
    7 g# d4 @1 d( J% Q
  90.         border-radius: 50%;
      g$ k: @0 {6 O
  91. }
    6 t( V: Y) i: w5 d" n5 ^: ~4 \: i
  92. $ N5 P$ V+ B+ k
  93. .shui-c {
    ) m- i6 W1 E( w8 l9 X2 H
  94.         position: absolute;, x, a) R0 _- T5 {+ i7 J  D) N
  95.         top: 18px;
    * [2 i% D% _, n/ e+ G, a1 z7 i
  96.         left: -2px;
    + j. S  x9 [& V7 W& M# z7 J
  97.         width: 10px;/ P, n* k  ~; Y9 z" ^+ a1 p
  98.         height: 35px;
    * h5 k5 S* @* H* R  L  z
  99.         background: #ffa500;( W+ _: w4 i. y: T8 o% j
  100.         border-radius: 0 0 0 5px;
    " v0 ~$ k& s0 }' J# \6 _5 X
  101. }" R8 d1 B1 m. q) q8 r

  102. , r$ [. g1 u4 k& s, Z3 A% F) Q. {$ j
  103. .deng:before {
    $ a7 ^  v2 h3 X/ _9 s0 l
  104.         position: absolute;3 ]/ `# y7 E, x( w1 W& e) q* W% ?
  105.         top: -7px;8 ~& B- J7 w  ]
  106.         left: 29px;
    2 K8 |2 L. _& h7 L1 t0 i
  107.         height: 12px;' d* }+ K1 e. j. a8 c; x: \
  108.         width: 60px;
    4 b# _+ O  W. T
  109.         content: " ";
    + _, J; @0 {9 z5 F7 K9 \
  110.         display: block;
    $ r* M* _" w! E; l6 C, U, x
  111.         z-index: 999;" P( M0 \1 _+ m% T; W$ q
  112.         border-radius: 5px 5px 0 0;6 a" x6 S# j9 H0 n2 v: d
  113.         border: solid 1px #dc8f03;
    * ?3 l% a; v/ N) w+ R
  114.         background: #ffa500;6 h  K$ J; e4 R# |: `6 ]
  115.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);- J0 r# v( ^% s5 w/ w" C# V4 |
  116. }  q" Q2 h2 ~8 ^: A& K

  117. . g) q$ a' I! U! x) T. @
  118. .deng:after {
    8 j/ c( z( q* ]5 W7 q. w
  119.         position: absolute;
    1 W% f" @& Y1 x
  120.         bottom: -7px;
    , x' |% }# V, g1 V1 i
  121.         left: 10px;: A, A; |; V4 C; j6 O
  122.         height: 12px;7 t' G" C- N2 p* ^  b
  123.         width: 60px;
    0 k/ w' o& N( k
  124.         content: " ";
    6 c, L4 h8 P6 S
  125.         display: block;( j" t* F8 V1 C- N
  126.         margin-left: 20px;
    : Z$ R# ~, \$ L1 p! M1 F3 N. e( |
  127.         border-radius: 0 0 5px 5px;
    : N% A1 C/ |# e  y
  128.         border: solid 1px #dc8f03;
      A* l1 a  l& V- P* I! ?0 r# |  _
  129.         background: #ffa500;7 E! r( j- @8 W4 I# j! L# C
  130.         background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03);# O, J4 F- Q# l( U, Z
  131. }0 P4 T& l3 J7 ]8 I
  132. 4 x! D% ?% S; Y* M% L, y/ ]
  133. .deng-t {) r  |0 E7 L9 d9 _* c+ s
  134.         font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;. q2 e! ~- s; S: }! e0 U0 s1 d4 `
  135.         font-size: 3.2rem;( _/ S3 c; Q: y4 _9 y5 q9 W
  136.         color: #dc8f03;
    7 d8 W0 s0 g2 m' P1 ~& b
  137.         font-weight: bold;
    # X( S9 [; _* a6 F9 _: y
  138.         line-height: 85px;1 F& Y: z% A# m$ J5 [! k
  139.         text-align: center;% E, v( j& b& _
  140. }
    4 D3 L- o8 R1 j7 M) @& M8 ?
  141. 4 x& |4 U! w  O5 z, |
  142. .night .deng-t,
    2 c7 x" \! ]3 h
  143. .night .deng-box, 5 N: \7 s, J: |9 @# u
  144. .night .deng-box1 {* Y4 o* Q2 o( |' c  C9 T- u
  145.         background: transparent !important;( q" g$ R6 d0 g6 k) ~7 E
  146. }
    , U& h1 _: g' _8 `' x% P

  147. 7 B% k& q' C/ g0 r
  148. @-moz-keyframes swing {
    " W4 x' h9 S, j/ \
  149.         0% {
    0 r! p  q: t( M6 R: `
  150.                 -moz-transform: rotate(-10deg)
    , A0 f7 x: g2 |; K! Q
  151.         }$ }, m2 m/ h! e9 u  I1 k

  152. / J5 U1 T5 a8 }6 n) Q: D% H
  153.         50% {! v1 i5 [5 m3 c1 t7 D4 f
  154.                 -moz-transform: rotate(10deg); W* J; S. [% e# N0 {+ e
  155.         }2 j' z+ `/ e& i
  156. % C! B# C% @5 j: |
  157.         100% {, Q+ f' G9 q( ^
  158.                 -moz-transform: rotate(-10deg)
    ( i( V4 w8 [' E, C0 \, {# s8 s
  159.         }, n& s. o  `# d4 J( {6 S. n
  160. }
    % g; l/ E6 ?( L) W' r5 R

  161. 7 }6 m; v4 U6 b3 r  U, b
  162. @-webkit-keyframes swing {& o, m. u- ^; G0 A& f( y
  163.         0% {& ~: r5 O. B3 \; V: N( ^2 N' }
  164.                 -webkit-transform: rotate(-10deg)* @# a+ o' t. [5 k- _/ O
  165.         }& M+ |( M9 U2 Y: a9 z4 V

  166. 8 g5 ~# n  c$ x/ C) ^
  167.         50% {( O2 S8 H9 e* W3 L" u
  168.                 -webkit-transform: rotate(10deg)4 u/ S' A4 _$ k( h6 g
  169.         }# o' ~* g3 h6 C* E2 e, ?
  170. 4 N" Z  W  S: k$ W) J
  171.         100% {5 E* T8 }' M9 N! a- \
  172.                 -webkit-transform: rotate(-10deg)2 Z" G6 Z5 I8 M2 L6 V
  173.         }
    # Z) [/ F) j( k$ J/ m
  174. }
    , \/ V/ P6 o) X  H. g; k0 D' y) I
  175. </style>
    % |* W# J6 G5 M5 g- T% `% u* A
  176. <body>
    0 L7 @  {1 l9 @  c
  177. <!-- 灯笼1 -->2 C# `9 F( K4 N6 S$ e6 c
  178. <div class="deng-box">
    . d  G+ N9 y9 c( R: {3 H8 n
  179. <div class="deng">$ f6 F/ u! Z9 t) x* G, j
  180. <div class="xian"></div>: f, P# E. L1 c. k) v6 w
  181. <div class="deng-a">: U  T2 N7 x3 b) J6 u4 n0 i* d
  182. <div class="deng-b"><div class="deng-t">庆</div></div>
    : q0 s2 e. R- n+ p$ [9 @
  183. </div>6 B8 [; |! N- |/ \
  184. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    0 F/ i0 }9 K: Q! A
  185. </div>
    $ I) y7 i- e) J% R$ |5 w; a) i% J
  186. </div>
    ( T5 O$ O* F: {* r1 M  N3 |
  187. <!-- 灯笼2 -->) @: ?4 ~) R' m3 d( l
  188. <div class="deng-box1">
    3 W+ F7 m9 g, z. P
  189. <div class="deng">
    8 J2 X- Y5 J% t, T
  190. <div class="xian"></div>! \& v5 x, J% z
  191. <div class="deng-a">
    5 s* L# K2 r3 ~/ i
  192. <div class="deng-b"><div class="deng-t">国</div></div>& I8 M  z6 j# z; E# D: A
  193. </div>1 }; f$ a. r+ J+ W3 b9 ?! m& y
  194. <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
    6 {& {" n4 G& l& K  \
  195. </div>4 E* n/ q7 I$ E; S
  196. </div>) s/ a' I/ y; r: j3 n/ y$ `+ k
  197. </body>
复制代码
上面是两个灯笼在摇摆(示例：www.5gbbs.top），在右边。现在要加两个在左边。该怎么加代码？
' y6 M9 s, n: t, s  T! v: O" `
) p, ?+ s% t. @# e, X
回复

使用道具 举报

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

使用道具 举报

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

使用道具 举报

 楼主| cao1987 发表于 2020-10-1 17:50:12 | 显示全部楼层
已经编辑出来了。效果图
8 a4 a7 g" S) T+ ?% f, t1 S
$ U- l' \3 s) t; y! v# {# R5 u

本帖子中包含更多资源

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

x
回复

使用道具 举报

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

本版积分规则

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

GMT+8, 2025-6-7 16:11 , Processed in 0.048872 second(s), 19 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

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