开启左侧

[学习借鉴] 美丽帖子编辑利器Discuz颜色及排版布局模板代码分享

[复制链接] 2
回复
1775
查看
打印 上一主题 下一主题
楼主
跳转到指定楼层
发表于 2016-6-24 11:27 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

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

x
相信很多人都想要自己发布的帖子是美美的,漂亮的,
今天就给大家分享一下如何把帖子编辑的漂漂亮亮的
感兴趣的盆有可以进来学习下哦!

- x- |0 {/ @5 O7 p4 O; l* `
简单边框之一:
* ~- _& D6 Y% B7 d- U& g4 \5 D2 F5 K! o8 u2 x5 K
单纯的内容边框
& @. P8 S$ [/ T+ J% O! u. \: R/ ]# J
; C4 ^  S2 h( z) c0 B& x( u; h# F" k1 x& P
内容
. b* H+ I" U$ S# w# }# G
代码如下:. ]+ U# h) F! i( _7 v# z1 I# A# U
  • 内容

    8 S" b; g; c  l, `: _
( p4 E7 Y1 z& Y, l  i1 H
复制代码

- M+ w6 E! r. j6 `( ~/ N
1层边框
; H* n& S: D4 H, s( L
内容
代码如下:
  1. [table=560,#ff0000][tr][td][table=548,#ffffff][tr][td] 内容[/td][/tr][/table][/td][/tr][/table]9 |1 E. |3 A" T# @+ t. A- ~
  2. 复制代码
复制代码
6 K1 t8 ^8 @+ p. p0 c' q& X

* F5 k. ~& b6 g" H
  • 内容

    / n; @" |6 c# _6 o/ ]; j/ Z" w( m+ V
6 Y5 S* c6 ~% F2 Y6 p4 K( j
复制代码

9 B0 s" K! {: o6 K/ O; H" t
! s. Y8 D( T  |1 |
2层边框6 p  z; |# d, x% i
& c, G- a6 L, L0 |- U9 U
内容
代码如下:
  1. 01.[table=560,#cc3299][tr][td][table=548,#5c4033][tr][td][table=536,white][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
复制代码
% D+ _# Q. L6 n  p. J

2 n- u' |2 `9 t1 e) K# m$ x
  • 01.
    内容
    $ T7 S+ k* S* \/ ~: w) Q
2 o8 x- r# W3 h- T) ~
复制代码
0 c/ a+ K9 @/ y# G0 {
+ B6 L0 f  M+ c$ [+ K
3层边框) o6 j7 F; e5 q8 Z5 G  B
内容
代码如下:
  1. [table=560,mediumvioletred][tr][td][table=548,palevioletred][tr][td][table=536,lavenderblush][tr][td][table=524,white][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
复制代码

1 g1 s  t5 @4 d7 l. O4 {3 `4 U9 ?% z. N/ }% Y
  • 01.
    内容
    $ m) d' h8 ?3 h( U7 {/ L2 B
! m- J: T1 m0 d8 ^! Y- `
复制代码
! H( o' q- @/ v$ L

+ t  i4 R/ {4 ?- ?5 ~3 V, ~/ C6 D7 j! O! e' l- A
简单边框二:! p' U& T% y8 `! p6 n- l% G

7 m: f; ^# X' |; g7 c) q. F边框效果:
9 Y% x7 n3 m; }

& R/ n1 B( |5 g! J( i0 E, V6 J, p3 m
内容

/ ?( D3 E  v% _: M( C. z3 v代码如下:6 r' P1 A3 t: R* u' ]

" g( K. O% b7 S4 i9 l/ O4 l$ R
( j# J+ z1 l# H& f4 ~, C9 h( ~* T8 m8 Z0 L

. S" m& M4 _! R: p6 S' s0 @5 e5 N0 N' P! ~/ E7 {
  1. 01.[table=560,#000000][tr][td][table=548,#ffffff][tr][td][table=536,#000000][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]  O' x# ^; p) d7 g6 p
  2. 复制代码
复制代码
: }5 [, u+ R2 l: n0 ~* o
: e9 @. ?- g3 l: s1 O

% Y- U: H* W5 w5 l( d: H- v
% U$ z5 |# \9 |& v( W6 k0 p/ E
    1. <div id="code_MEi" style="word-wrap: break-word;"><ol style="word-wrap: break-word; margin: 0px 0px 0px 10px !important; padding: 0px !important; list-style: none;"><li style="word-wrap: break-word; margin: 0px 0px 0px 2em; padding: 0px 0px 0px 10px; list-style-type: decimal-leading-zero; font-family: Monaco, Consolas, " 12px;="" 1.8em;"="" serif;="" new",="" "courier="" console",="" lucida="">01.[table=560,#000000][tr][td][table=548,#ffffff][tr][td][table=536,#000000][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]</li></ol></div><em style="word-wrap: break-word; font-style: normal; color: rgb(51, 102, 153) !important; margin-left: 43px; font-size: 12px; cursor: pointer;">复制代码</em>
    复制代码

    " o% ~4 b5 t( l
" x* P9 M9 I/ r8 V
内容

" n* p: ?  r. P* R5 K代码如下:4 D& ^$ Z( R9 D' c
  1. 01.[table=560,dodgerblue][tr][td][table=548,deepskyblue][tr][td][table=536,aliceblue][tr][td]内容[/td][/tr][/table][/td][/tr][/table] [/td][/tr][/table]
    9 c* A0 v. l" I7 C* s* n( p" G
  2. 复制代码
复制代码

0 w( \  b, T/ Z
2 p. C' B: {7 n, {' H  W

% e/ {2 O; L. |" f8 z9 ^2 l4 `
  • 01.
    内容

    9 w+ g8 y7 P$ L7 E! k

; D" |. N5 j1 V! `1 m- ~# Y4 a! ]
边框效果:% q% N; l5 E' H( ^
& N, p, z  s( d  z

& J9 K& T; b2 o3 N0 q
内容

1 V7 H. Z1 U" |) ?) V9 G* \代码如下:
/ ?5 Q. c: C5 V1 H
  1. 01.[table=560,#ff9999][tr][td][table=548,#ff6666][tr][td][table=536,lavenderblush][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    1 \, }0 ~2 r# A" {, O* \) c5 ]
  2. 复制代码
复制代码
1 ]" M5 F% ~/ ~6 |: w* L

" C7 g6 @8 e! Z* F& S

% }% C8 f6 s1 Q: e( w: h
  • 01.
    内容

    4 }% P7 r) @  \; P! o7 m6 ?: |. m

/ `+ N3 q* E' T5 d
边框效果:" K$ l5 J) A3 C: S; z6 x9 s( L9 v1 b
3 t) o- t+ E( b1 v' g( b( ]' |

  M3 D# Q# |. a1 A: i8 n) r' o! C
内容
: h# K* j6 _) A, r4 L
代码如下:
) q* t4 g9 q: {; ~- b: h. v
  1. 01.[table=560,chocolate][tr][td][table=548,peru][tr][td][table=536,antiquewhite][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]- \) |# ]! V  _  O& y/ `: d
  2. 复制代码
复制代码
  V) w4 s! d) z& q

  x" p9 f) r# n9 \7 |* T5 f: I0 O
/ V; ^2 o) _. o. ~  |+ @: @7 H; k
  • 01.
    内容
    - m8 L8 Z4 }, B/ H* i5 d- g
& G6 s) H. r+ J4 S7 o/ |
边框效果:
3 z8 A2 t" d' p" N% _

3 U) Y6 w9 N3 g8 t
内容
2 o; W( \, H5 f
代码如下:
3 L, b* P+ G7 A
  1. 01.[table=560,green][tr][td][table=548,yellow][tr][td][table=536,floralwhite][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    ( J  M1 U6 i) ]! A7 r6 |% D2 P
  2. 复制代码
复制代码
% l1 O% d7 b( L: n, @# n

2 q( G5 s# Z* l

9 c5 {5 P* j! o, ]6 D9 Y0 T
  • 01.
    内容

    1 I# |7 O5 u+ U+ h+ M( f4 }

' Q) [6 }$ g7 O2 C
边框效果:
/ F$ S1 g3 L7 E3 [  T

4 C5 j5 Z" M0 i& N- |& g; n; P: u- O
内容
$ K' Y& p; r$ _' D9 E7 X% T
代码如下:+ X, i8 o6 ^2 @7 X4 z0 w
  1. 01.[table=560,crimson][tr][td][table=548,deepskyblue][tr][td][table=536,white][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    7 Z& M5 t4 x6 P  S, n" n- o7 |* a
  2. 复制代码
复制代码

. w7 R" L/ k8 N# ]! y/ c! u: Q/ }+ b: T3 f4 @( E- u
, w9 d; C3 W5 I0 W7 @
  • 01.
    内容
    4 R! W* V# ?- X
边框效果:
: `( Z8 A1 ?7 u6 r5 R9 E
  e$ [7 Q; K0 `& `- L, b, P5 l
内容
2 h  y7 S( D  {
代码如下:1 c6 k' I. Q- v
  1. 01.[table=560,blueviolet][tr][td][table=548,white][tr][td][table=536,blueviolet][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    : e4 F' M( H; Z: c7 w* e0 K
  2. 复制代码
复制代码

  V3 Y, a5 h+ k7 Y; }2 k! C2 f
5 Z5 X- ?) H1 v' v0 l
( I3 \% H9 q5 G: A. B& e/ v
  • 01.
    内容

    9 w6 A4 f7 d. D' Q6 W. \

/ u! k; Q9 o! z- A% i( Z

; o- N9 N) i, f& x边框效果:, x1 j9 O* \( X! C  {( b, q
5 y* F8 i8 a0 g2 F7 K; X, \
内容

) C! l  a8 Z) u. p2 V3 }代码如下:
2 }) X  o# K' K( d; ]( X
  1. 01.[table=560,yellow][tr][td][table=548,black][tr][td][table=536,#ff0033][tr][td][table=524,white][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    " w% C1 U  o- r- d4 H2 N- X6 M9 @
  2. 复制代码
复制代码
1 z* Y1 O$ {: j+ ^

7 o! c; u/ a& f! _) d4 \

7 \2 K" w% A6 Z+ @4 w
  • 01.
    内容
    0 I* ^+ A9 A! b
/ y7 L6 T% F+ T/ I7 L" b
边框效果:
. `- ?% q$ E- d; C
/ f" o7 c8 a9 X8 X* O  \  s
内容

  F' l+ I  ]( O7 z代码如下:
7 _) o, e( z& F7 ^' e: P& ^
  1. 01.[table=560,dimgray][tr][td][table=548,darkgray][tr][td][table=536,whitesmoke][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]! `- \$ {1 b1 e9 |2 F
  2. 复制代码
复制代码
9 A- A8 r: U" [3 @% v
4 O! c/ K3 @" O* q* |# a% V& [

$ Q, P2 b) X# H3 R
  • 01.
    内容
    $ z/ t& T* \+ }; B1 H/ t& u3 Z

5 M: N$ E- |  {/ `( u9 C
边框效果:
& f/ F1 |' a1 _. w3 l9 k

: J/ H! f' }0 i4 J- I+ v
内容
; }5 s' m, z/ `* W0 l+ V5 f4 j5 L
代码如下:
6 M1 K1 X+ G# _$ s( e. K
  1. 01.[table=560,#007fff][tr][td][table=548,#ff1cae][tr][td][table=536,lavenderblush][tr][td]内容[/td][/tr][/table][/td][/tr][/table][/td][/tr][/table]
    . v/ ~  ?7 C  K
  2. 复制代码
复制代码
% Q+ g1 U0 f0 J* G5 d3 z

: B  t, w. D4 a3 D& b  Z  k

* y' Z; p3 ~- L8 l; ?% L5 N( h/ S" N
  • 01.
    内容
    7 P- D6 s$ C9 f5 x
4 H1 u2 T; U2 E! O3 X) s
. T6 m  V  {" I* T- T
方法:
3 J3 F: h4 [9 q5 y
把代码复制下来.
% u3 D4 f2 ~& i' U7 D粘贴到你要写的帖子中...
7 n% P: G4 }" S9 @然后勾选文本编辑框右上角的纯文本..., q. P0 n1 ^4 n* e  u! p( k$ l
你就会看到代码.....
1 p; T+ {; A8 W  \$ K: T" T其中[img=]这是是你的图片链接,等号后头是图片的大小[/img]8 l6 _3 x; n- _1 {
table=560,#ce0000     第一行       #号后是要你替换的颜色代码2 P" c/ Y" t3 a+ I
table=550,#ea0000     第二行
: Q, ?, k  E* S2 a$ ?9 Rtable=540,#ff7575      第三行7 \: T) Z3 v9 `/ R
table=530,#ff9797      第四行6 g% N7 a, {$ {
然后想换什么颜色就填写什么颜色的代码就可以啦!不用感谢我的!

4 |. L4 d# D9 ^: A- J# n
0 m# D0 C: ?# p/ W7 P6 W
2 n" U# @4 T% @, K# X: t
备注
5 ?* w  c; N& R1 H  Q" y' n2 D% t! M9 i; p& z- c/ ~" ^; p0 f
帖子里“=560 ”是帖子宽度  #999999是颜色代码。. d/ U8 P" e) W7 x& q3 {- d+ q
如果想改变帖子的宽度跟颜色可以在这2个地方设置、多层帖子宽度之间数值为“12”7 [- V5 G' J- m
, S  i! k7 w! B3 W7 e2 d
table表格大小不要超过560,超过发出来会自动变成98%. f$ @, G' z, R
* w' c) Y) b- {9 v- H& l; C' c6 K
颜色代码:9 v4 x, k8 a. p  B2 X1 V  M+ [) R, ]
发帖时使用的格式为:(color=#FF00FF)要打的字(/color),用的时候把()改为[]。
5 N0 J$ y  B( g' q7 J+ u! ^4 S7 F3 H% G: k
效果:
5 n+ G4 r! d' R$ _( z. g0 f7 c
/ p" k/ _+ o+ \5 }3 T, ?1  白色 #FFFFFF (这里有一个颜色哦)% l7 l! e+ N; l/ n
2  红色 #FF0000 9 Y+ E3 \4 X- d
3  绿色 #00FF00 5 l  ]1 `4 ~. O/ Y! E; w
4  蓝色 #0000FF
) W7 S# R9 g; T" @0 ]3 L: F5  牡丹红 #FF00FF
# D* \+ p1 q) G6  青色 #00FFFF
, g& \2 e. h5 l/ z1 {+ J3 s0 c% z/ d7  黄色 #FFFF00 $ X- l2 F/ b$ j+ y* }
8  黑色 #000000
. Z2 U: w# h2 j4 w3 ~* `2 E7 ~9 W9  海蓝 #70DB93
& q9 |# k0 z# a* ?9 L# D8 C10 巧克力色 #5C3317
, T8 ], I6 L' M5 G11 蓝紫色 #9F5F9F 8 P$ y8 W, A1 o1 f0 F! h
12 黄铜色 #B5A642
% V, }) U1 g/ \) Z. ]13 亮金色 #D9D919
/ x* D6 @. w6 A3 M% K& H14 棕色 #A67D3D
: g4 Z! Z8 l" x$ G. K! L( w15 青铜色 #8C7853
: C) |* E5 J/ `1 [16 2号青铜色 #A67D3D
% E( f" Y; Q  I+ w17 士官服蓝色 #5F9F9F
. A/ b! o! B: N! L) V; I18 冷铜色 #D98719 # I5 C' s5 g' j$ L
19 铜色 #B87333
3 ~4 `5 N: W2 N6 ^* v$ c20 珊瑚红 #FF7F00
0 c) k# k& A# _, o8 v: a21 紫蓝色 #42426F % W% v3 C7 n( J/ S% c/ U
22 深棕 #5C4033 : p$ P7 B; L3 G  N0 T7 F( R" ~
23 深绿 #2F4F2F 0 I  f  R9 u1 b, {$ Q) f* ]/ Z6 a
24 深铜绿色 #4A766E ! x' H- Q1 U( A1 J
25 深橄榄绿 #4F4F2F # S+ _8 Z* B8 C0 K: Z' j" ~
26 深兰花色 #9932CD + u- p, f1 |) n, f
27 深紫色 #871F78
: [) |8 j7 k) ~( o. V+ {28 深石板蓝 #6B238E
3 `9 Y. t/ S2 d29 深铅灰色 #2F4F4F & A1 z# H6 R5 F5 e8 e2 K
30 深棕褐色 #97694F
* k5 L; _. V4 ?& l! p0 J32 深绿松石色 #7093DB
5 C4 Q8 E. y9 [& v33 暗木色 #855E42
! I6 d. W; H( q/ }34 淡灰色 #545454 ) B& P0 T& G" G$ B  v
35 土灰玫瑰红色 #856363
9 ]: X+ G# q( C36 长石色 #D19275 # |5 ~1 A. x# u2 x
37 火砖色 #8E2323
8 C9 C: F8 ^' O" S3 ~$ H: w38 森林绿 #238E23 : U3 F4 F" R$ |1 v, \! b
39 金色 #CD7F32 1 y1 D3 m! Q$ |7 a  l  `1 [
40 鲜黄色 #DBDB70
0 U% k# N2 P) }* K2 X$ ^. }8 c41 灰色 #C0C0C0 % t- e5 x6 z4 d" ~
42 铜绿色 #527F76
- N; {5 W9 b7 ^43 青黄色 #93DB70
! a! T# z& m5 D) l% o( d9 Y44 猎人绿 #215E21
: f7 n2 ?0 l8 [( s! s0 m  R* a4 O45 印度红 #4E2F2F ; y% B! t# p3 y! i
46 土黄色 #9F9F5F ) z$ o9 p7 p6 s# s; ?
47 浅蓝色 #C0D9D9
3 a3 ?0 ?, J. ~: b! }48 浅灰色 #A8A8A8 2 K; f, O1 A) i6 H' N- o
49 浅钢蓝色 #8F8FBD
  u, r: G! {" I59 浅木色 #E9C2A6 ( e" B) N4 Q0 B/ ]' I
60 石灰绿色 #32CD32
' w1 _- e3 V) l/ r( l0 X61 桔黄色 #E47833
% O' Z& R$ B* Z2 [5 f3 X, M62 褐红色 #8E236B ( W* n! R$ i6 [4 }, t& i0 I
63 中海蓝色 #32CD99
) b. ]( i4 X/ F3 ^; S$ a7 ^8 u1 e64 中蓝色 #3232CD
7 n! X4 u/ o2 I" s1 b6 T" @65 中森林绿 #6B8E23 + p. d$ F+ {' I
66 中鲜黄色 #EAEAAE
! J8 f" e* k8 f, D! Z% m67 中兰花色 #9370DB 3 A6 x( I3 i) Q" g
68 中海绿色 #426F42 8 V/ x  u4 L5 n' {6 ]# n
69 中石板蓝色 #7F00FF 1 T/ A/ H5 X6 d. p$ ^5 e
70 中春绿色 #7FFF00 . X# B- C& T: ]* }. c6 v+ Y
71 中绿松石色 #70DBDB
! @0 S$ G' U6 ^. Q/ z72 中紫红色 #DB7093
. ?4 d6 h, z, j: k1 |0 ~$ a73 中木色 #A68064 6 X0 a: e, y: b$ [2 i
74 深藏青色 #2F2F4F
: Y' B6 q4 h0 f( P( W75 海军蓝 #23238E * v8 F" X: ?# V
76 霓虹篮 #4D4DFF . j/ \  ~$ z" X; Q% E6 S  S
77 霓虹粉红 #FF6EC7 0 @' L$ j8 _1 V1 Q4 J
78 新深藏青色 #00009C
! [9 A. i! F7 H79 新棕褐色 #EBC79E . |% S1 w1 ?( t1 _6 [* ?3 G. q  }
80 暗金黄色 #CFB53B
# H7 w5 Z# v2 ~& X+ \81 橙色 #FF7F00
+ e8 P: V, t; P82 橙红色 #FF2400 # d" S' r: @% `1 u6 g
83 淡紫色 #DB70DB
0 l5 S! g" h# l9 G. X84 浅绿色 #8FBC8F
5 ]- H/ v( [* D9 M0 V+ Q85 粉红色 #BC8F8F & ?! ^" z5 s) ?5 `) e: R' C
86 李子色 #EAADEA ' S9 T! M* F, O% {
87 石英色 #D9D9F3 0 S1 W/ s, c% Z1 ~/ s
88 艳蓝色 #5959AB : S$ U0 J8 l1 L* o5 f$ A$ ^
89 鲑鱼色 #6F4242 # a# T, a' X0 w- A3 B! [  F5 g
90 猩红色 #BC1717 0 D9 U3 P. O1 I6 i1 E# [/ N3 `
91 海绿色 #238E68
- d! X9 O/ h; N0 F1 \92 半甜巧克力色 #6B4226
/ C9 [3 ?) S8 z* J5 A93 赭色 #8E6B23 - }; L( f- a/ U$ N8 ?% U0 Z
94 银色 #E6E8FA
(这个是银色)* a" l# G* p7 f# v$ q* ?. A. B8 X% `
95 天蓝 #3299CC
" m; j% K$ R% @6 O7 m96 石板蓝 #007FFF
6 r. l0 C. J6 s1 Z. ?97 艳粉红色 #FF1CAE
% C8 d; u# m, _* u8 g7 s2 S; f98 春绿色 #00FF7F
# a" ^. C( y. r" b1 o99 钢蓝色 #236B8E
! q. l* p+ X, C% d1 K100 亮天蓝色 #38B0DE 1 l. b% }5 T/ ?, Z0 e9 }
101 棕褐色 #DB9370 2 r: E" ~6 p; J# D) d/ H
102 紫红色 #D8BFD8 / R4 R- K9 W  J
103 石板蓝色 #ADEAEA
& H' u+ H/ f5 \1 \+ {0 T104 浓深棕色 #5C4033 6 W' v) B6 j" n; S# P
105 淡浅灰色 #CDCDCD
0 g, _' r: f( I! V0 g, G106 紫罗兰色 #4F2F4F
4 V* r" F' u! E4 X' I- `107 紫罗兰红色 #CC3299
$ b( }, U& L6 e. x; k/ M108 麦黄色 #D8D8BF
6 s. G; w; \3 w109 黄绿色 #99CC32
& A' G& V) u7 V: a
! |& b0 V0 _0 W' m


转载请保留当前帖子的链接:https://www.beimeilife.com/thread-17367-1-1.html 谢谢
沙发
发表于 2016-6-24 11:49 | 只看该作者
table=560,#ff9999]
$ n1 e0 r  P3 o' z9 F: I3 `. k[tr][td]
0 v2 _# c+ W2 Q8 z. W/ q

: D7 r6 |: l5 A. b. i: ]* J
内容
[/td][/tr]
* A' [2 {3 B" v9 w' v[/table<p></p>, L) x3 m- `% @* N, u/ O# J

; E/ B; R6 z: R4 V5 G! q0 z
. x+ i& O/ S6 l2 y! H?
板凳
发表于 2016-6-24 11:54 | 只看该作者
http://sq.k12.com.cn/discuz/blog-1040829-9709.html

使用高级回帖 (可批量传图、插入视频等)快速回复

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

本版积分规则   Ctrl + Enter 快速发布  

发帖时请遵守我国法律,网站会将有关你发帖内容、时间以及发帖IP地址等记录保留,只要接到合法请求,即会将信息提供给有关政府机构。
快速回复 返回顶部 返回列表