开启左侧

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

[复制链接]
发表于 2016-6-24 11:27 | 显示全部楼层 |阅读模式

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

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

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

3 |/ h3 Z" f3 r- F" V- j0 E7 E
简单边框之一:
& r9 h' N, K% Z3 ^7 r
1 u5 ]& A5 A' k% P, |% O3 L
单纯的内容边框
" v# v4 \- E3 v" P* S* y* I; h  L) |( S. {# D- M3 F( ~3 y, d

$ u+ L6 g. b4 R" b) `. x/ s9 m" F6 L
内容

2 e, O' T/ }$ r# D  s8 a& }代码如下:: i3 H: ]8 a6 I8 g. Y5 R) q# j
  • 内容
    % B  i6 B1 P( N% Q6 S0 Q& ~, j

  b% v  S0 n: e3 {4 F复制代码

" C3 b( o( Z9 w7 k& N/ S9 e
1层边框
3 E; x% z& T" [( \2 v. x# ]
内容
代码如下:
  1. [table=560,#ff0000][tr][td][table=548,#ffffff][tr][td] 内容[/td][/tr][/table][/td][/tr][/table]7 w- ~4 S' Q+ T, j
  2. 复制代码
复制代码

5 a" |! v, t  _. D# Q# f  b
; ?# w. l5 ]6 Z& w
  • 内容

    & }$ E$ G+ c9 f1 L

/ g; m, o- @3 j5 P8 \5 }6 ?复制代码

' H- k9 a) [: E: Q3 D
; R9 w9 m; U, d. a7 q
2层边框
! g7 l. _& Z0 ]- F8 Y
$ a' A6 U' _% j1 s1 |) F
内容
代码如下:
  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]
复制代码

# F# q5 y8 P5 c: W! }* B! Q4 T8 n. A% c$ }" a- F* @/ v
  • 01.
    内容
    3 n3 X0 _2 J; Q) A- Z

0 f# h- [5 O) W+ t3 b4 D复制代码
1 W1 d: B% g! l3 F

$ M! b$ N4 Z/ h
3层边框
6 G- n$ L2 Z; o, H4 R  @. n
内容
代码如下:
  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]
复制代码

3 o1 u: Y) U7 g4 Z1 t0 Z; t7 D/ g: b
  • 01.
    内容

    7 f  y* z% |% {* S

- Q, G% ?, Z- F" w复制代码

, v6 W/ e& w1 X* }: t- ]
7 ^6 z6 ?. P( s' R2 E
4 O0 K; {& M8 Z( |0 |3 B$ y2 s
简单边框二:; e2 A# Y; u3 Z& x

9 h3 [: z1 s( K边框效果:
9 b! v6 J& g4 b5 W0 X& c

: o- p* p$ F: C
内容

$ r3 _7 k9 f0 q) p+ T+ r  d1 t代码如下:: ]; z% c3 v" O8 J# P3 X4 _$ ^

+ Q, X- h: f7 A0 b' r/ e/ i* V1 X/ b7 H0 @6 `& V
; ?$ A8 {  p4 s( u0 K
" O4 ?$ \4 b: s
, D  P0 {$ n% h* a% t/ }
  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]% ^- b8 D9 H( k$ J2 E
  2. 复制代码
复制代码

! ]! c% S) J- d( y8 ~

3 x8 \0 D0 A; K- e, L5 q
- Y$ }8 o; {6 A+ b
! g8 k8 s# |; X" y. _# B
    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>
    复制代码

    9 A3 l- ?& c7 ~* Z, X4 d

1 |2 d* \- z) ?( w1 R& s7 u
内容
  b& u/ N$ K# x1 c7 ]4 `
代码如下:
7 e9 D5 S4 r  w' E0 `
  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]
    - R" y' S0 N1 _0 l$ G: T0 p
  2. 复制代码
复制代码

# Q% D8 Y6 J2 s& t5 C, t8 U! V5 u0 A: [) t4 b

0 c; r- z4 p/ R1 e1 f4 j
  • 01.
    内容

    ' v  R' t9 [7 d0 C  J

8 T& z9 `8 Z0 d) Z/ v  `8 ~1 L
边框效果:
) e0 v, y! \+ m8 `9 x: z" b
% k, c) b: ~) @1 J5 a: p: t
7 g9 J- i, L/ @
内容

9 ?% P& R/ N, Z; ^2 @. `代码如下:
8 q4 I6 v, P! b
  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]$ G1 e( c$ c( a6 `6 t* j" J
  2. 复制代码
复制代码
8 X  S1 o$ q6 f4 J

& j0 z6 R* z9 u3 C& x+ g! e
0 R7 E" g6 A2 m' j
  • 01.
    内容
    $ c* g9 q& L: ~

; J& y* x( r6 b. y8 F$ w2 U
边框效果:
' j4 K. P' g8 o: o2 e
4 V2 Y- J& Q; c  E/ F( B: L

( [6 q' v& ]( s: U
内容
: K9 W% a* b7 D
代码如下:
3 z9 B" e/ H1 Y9 {! `# m9 T
  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]3 G7 v/ f, I3 c
  2. 复制代码
复制代码

$ x  N, c$ k) B5 I- e2 r+ M# p0 ]& ?, e( A; R6 U8 v2 W

9 W8 D" O5 T0 U0 D
  • 01.
    内容

    2 o; q& R$ u  o- `6 r* l

& ]0 E4 @$ A! d9 g9 y  T
边框效果:
5 w! T2 e& ~- D" M

/ _! _) n7 X- b. a3 F8 Z: x
内容
* P! s2 O- ]5 L+ C4 v( ?
代码如下:3 W) [1 X% R' K7 c1 H
  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]4 Y% x+ W$ u" P( g/ q
  2. 复制代码
复制代码

/ W/ d( a$ ^* A! n% \- _# l! Z' o% I+ k# U9 |

. z2 O# V( h1 C
  • 01.
    内容

    2 H2 o5 \3 t* N/ s8 z5 o6 u
1 c4 }3 i1 h& u  X* S
边框效果:  ^0 r# d4 r( x3 V8 w

& l# P' h8 K, k4 I6 j7 l* g1 S7 Z7 z
内容
1 `" Q$ w, B0 h) I, b( Z
代码如下:
% r. R2 I5 ~) w( x
  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]/ u5 N5 n# g6 R" \6 n- M
  2. 复制代码
复制代码

7 j, \8 K: S) i' e  b9 f* m* ]. \1 V) F/ c

) i6 Q$ n1 _/ z: Q6 Z
  • 01.
    内容
    6 ?; P0 \, d" U: ?9 r% d& E" l
边框效果:% ^' A! \9 u$ l1 y9 O5 L0 h+ x( Y

: P5 ?, [6 S! T/ B
内容

* _( Z, z1 _  G9 h6 `6 y$ l/ k代码如下:% f: Y! p3 W$ |
  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]- I- X3 X' }) C$ G7 p# k
  2. 复制代码
复制代码

! _0 `; m9 A5 Z& E+ E$ o/ i3 R3 J! a( y

  x% j. C3 b) p% F# |$ J
  • 01.
    内容

    8 G( J. K3 c) a( c* A( _" W8 C* l
" S5 C2 a) b1 E0 G+ B* F6 D4 e- o
8 U+ _/ Z+ R, ^4 z  I( B
边框效果:0 M; l' |4 j8 v8 P
& Q2 N( J$ e" \& G& d  z  T
内容

, p! j8 A& j8 P# W: T& W代码如下:+ S$ q9 D9 _& d. X1 o- \" 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]
    * Q# U/ ~; _, N% P
  2. 复制代码
复制代码

' k4 v0 i) l' e% p' @1 Y& m  u3 I/ j* X( q' V
  V! Y7 |0 k5 `+ x
  • 01.
    内容
    ! a1 @# F  O6 G% m8 X& m

5 U0 h( N4 X6 x+ e+ O0 ^
边框效果:. f0 B& C4 V% [2 Y; U

- U$ C& R4 g; Z
内容

$ X% V* H6 X7 Y5 e代码如下:
* W; P$ q4 P/ i7 ^: _  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]* D- Z3 A% i( L( }  g
  2. 复制代码
复制代码

$ `$ I" d5 S, \) N7 ^3 \. D0 n9 `; ~3 K- i/ w

( `. p/ @  i& h% L; v/ f2 g
  • 01.
    内容
    % R+ X. V  ^' S( n& L
5 E3 c0 ^* @4 |9 H
边框效果:+ h# v& O0 ^7 l: R

+ y' I# n" j' W( u+ g
内容
9 }3 K2 @2 _( z8 Q
代码如下:
6 o: b: u3 T) u
  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], K& A: h. `6 l5 g
  2. 复制代码
复制代码

5 q0 n" m, D# [$ o8 S) c
0 J, {6 a1 [- T) H, K
5 O; t4 K  V1 t" C, A2 c; z7 }: f) `
  • 01.
    内容

    ) S6 v+ n8 c" i
) j; t" i% e& a, A3 _
* m% z* G0 l6 P7 A" q( m
方法:
% v% {( L0 g2 n. l
把代码复制下来.
1 D# ?4 e6 g/ |7 I/ E7 i粘贴到你要写的帖子中...
; k, S# l8 x2 S" k. w& N; n然后勾选文本编辑框右上角的纯文本...
" k1 w3 `; ?+ d( L) O4 |你就会看到代码.....
$ S# j- X: j2 A% l9 d9 H7 L8 o其中[img=]这是是你的图片链接,等号后头是图片的大小[/img]8 T6 }1 N) ^2 i* r# K/ v
table=560,#ce0000     第一行       #号后是要你替换的颜色代码
6 k8 O8 ~0 f8 Qtable=550,#ea0000     第二行% e( l$ f+ n1 d1 ~) I
table=540,#ff7575      第三行
) P" t& Y! j5 q3 E% c" |. \# |- Itable=530,#ff9797      第四行& z" d  |" _, R. W
然后想换什么颜色就填写什么颜色的代码就可以啦!不用感谢我的!
( H1 }9 p* x/ e5 v2 Y1 J

+ K+ V* p8 y  x! E# w% C
6 [' k9 @; \; o4 e  J4 ]$ n
备注
2 ]4 r1 _# J9 Y! z; d* b4 n3 {: T. g# {8 ?$ X% n
帖子里“=560 ”是帖子宽度  #999999是颜色代码。
) n0 A7 t( z* Q如果想改变帖子的宽度跟颜色可以在这2个地方设置、多层帖子宽度之间数值为“12”
& R& ]3 G, E6 Z" X
4 q4 g# L6 N" X$ _0 w4 q- Btable表格大小不要超过560,超过发出来会自动变成98%
9 K) h& p! s0 f( N$ g" \( h7 R* ]6 h' b9 t% F5 o  o5 G
颜色代码:! s% C  M7 G# d) n
发帖时使用的格式为:(color=#FF00FF)要打的字(/color),用的时候把()改为[]。
! X& n8 `) G% G. X2 W- T
: \; n8 ^% A0 n9 Y4 }2 C9 c0 ?效果:
( h) _: U3 b  w! `: ^; g7 j7 @( R
3 R( n/ t. |( ]4 e1  白色 #FFFFFF (这里有一个颜色哦)
( X$ z* n" V1 H
2  红色 #FF0000
, j9 I9 }7 v1 S: l8 b3  绿色 #00FF00 % z3 I4 y' j5 z6 [0 U
4  蓝色 #0000FF 2 @  C+ d$ L0 o% q: v# h, U
5  牡丹红 #FF00FF 5 x. C' {4 A4 B8 J0 q- y$ c
6  青色 #00FFFF 2 n% x, N. S% J4 o' }) J
7  黄色 #FFFF00
& f! f% _4 ]( ?- {3 z( l( f  @8  黑色 #000000
  |% F1 Z6 h2 I9  海蓝 #70DB93 6 S- L- }/ n( Z- i3 l& u0 h
10 巧克力色 #5C3317
& ^. n9 y. K3 K* ^! y7 P' ]11 蓝紫色 #9F5F9F 2 ?3 _9 O- ~$ ^! e. Z2 a% B9 D: o9 D
12 黄铜色 #B5A642 " h# n- O7 C# d( |
13 亮金色 #D9D919
8 H& m. M/ y. Z3 F# @- V* g14 棕色 #A67D3D
- [1 m* K% X' A, o* L15 青铜色 #8C7853
. K; L* \5 T$ z- j. r+ ^* i/ z16 2号青铜色 #A67D3D
" A# b* M3 k8 `  f. o3 h17 士官服蓝色 #5F9F9F3 m$ q3 ~: \8 e) i3 q( x! e% a
18 冷铜色 #D98719
, n  b# U7 w7 U" P( B+ L4 E19 铜色 #B87333 ) R9 u( h0 K* i' s" H/ b
20 珊瑚红 #FF7F00 3 f& _2 x; m* `0 k3 P
21 紫蓝色 #42426F ) r5 J7 D5 H: k  W4 Q& @
22 深棕 #5C4033 , V1 V1 ?1 a' y+ ]+ l" P7 T
23 深绿 #2F4F2F
) }$ f- w2 r% S' B1 L+ z24 深铜绿色 #4A766E 5 a; z) j  P% t6 N
25 深橄榄绿 #4F4F2F + |8 Q* M! Y( [1 M$ C- R) S
26 深兰花色 #9932CD ) v4 P5 W/ k3 v: e& D
27 深紫色 #871F78 ) G$ K; B( i1 P. O6 u
28 深石板蓝 #6B238E
# j1 u7 r2 M3 ^( Q: S$ n29 深铅灰色 #2F4F4F
- X+ z- b, I8 z' g6 K; \+ }30 深棕褐色 #97694F 5 L/ o: m; N/ m: _( t. d! b6 A
32 深绿松石色 #7093DB 4 U0 \/ `7 n5 d, Z4 q; m
33 暗木色 #855E42 - w: w& A- S+ I# o8 Y
34 淡灰色 #545454
' s' p: \# g9 k+ F9 E0 S35 土灰玫瑰红色 #856363
5 B& Z- a( ]$ x6 f: h/ q, X36 长石色 #D19275 ; l2 O, x" t' V. A/ i- o
37 火砖色 #8E2323
& b. v0 `* K; O# R/ T38 森林绿 #238E23
2 f* o7 c0 ^( z& k* H39 金色 #CD7F32 ( k, v7 e3 X8 a
40 鲜黄色 #DBDB70 5 V* H. w' q8 B9 l& y4 P0 w3 H0 G
41 灰色 #C0C0C0
$ J+ I, q% c2 ~$ e42 铜绿色 #527F76 * m; G, Z) N% M9 s3 ~0 k# k6 e
43 青黄色 #93DB70
* @, [& @* }9 k$ t- P44 猎人绿 #215E21
' w( j4 l& d& e; c45 印度红 #4E2F2F - Z4 [* M5 @) ]' n' R! C
46 土黄色 #9F9F5F * k: K: U: a9 w) U
47 浅蓝色 #C0D9D9 2 d- N  n! i( ~7 @7 x3 b5 U$ x# n
48 浅灰色 #A8A8A8
( I. o8 A- A1 p/ I% m49 浅钢蓝色 #8F8FBD . q( F- W( [& s& T& I
59 浅木色 #E9C2A6
* W# P, H" S5 H4 I6 l) {8 H/ @60 石灰绿色 #32CD32 1 {9 ^0 D2 O4 i  Z
61 桔黄色 #E47833
5 T1 G% V9 G2 G3 J62 褐红色 #8E236B
/ y# Y% W0 Q3 z- f  g63 中海蓝色 #32CD99
; a) W5 q) E9 x/ @8 s4 m9 z0 ^64 中蓝色 #3232CD
. h) g- Z" X  ^/ Y65 中森林绿 #6B8E23 ) m. p$ ?7 p4 e" z
66 中鲜黄色 #EAEAAE 1 v0 F! T% u5 E) i$ ^
67 中兰花色 #9370DB
8 ^) _; Z% m5 `8 x; D5 E68 中海绿色 #426F42
8 K" m( o0 Z, \) I+ @# F8 L69 中石板蓝色 #7F00FF # ^- q& S& Z7 Z, O
70 中春绿色 #7FFF00 6 K' ?  Z% P. V$ \  w7 _
71 中绿松石色 #70DBDB
( U; ^, P6 m* c" Z& h72 中紫红色 #DB7093 $ z. [: F# E# O5 O, P, Q; z
73 中木色 #A68064 - a4 u) ^% A# j' V
74 深藏青色 #2F2F4F
) S. M: A" S, R5 b3 F4 @75 海军蓝 #23238E . ]2 Y: T& M- U* o
76 霓虹篮 #4D4DFF
7 Y6 F1 `1 }1 i77 霓虹粉红 #FF6EC7 6 [1 ?$ C; D3 m  _) q4 `
78 新深藏青色 #00009C
7 ], r! a) j" B79 新棕褐色 #EBC79E
  _; Z( P1 @+ ?' n2 ?+ x80 暗金黄色 #CFB53B / T$ l' A) g$ G* D- ]: O; f
81 橙色 #FF7F00 - Y: n8 n& n1 w: ^7 h+ o3 t
82 橙红色 #FF2400
3 `6 L0 Y; m. o: E( ~. i! y! w83 淡紫色 #DB70DB : g2 |2 E6 _* W5 G) E- \3 s; A; ]' B
84 浅绿色 #8FBC8F
8 f) ?6 |) O, y8 O85 粉红色 #BC8F8F . n# K0 |) {# r  G; C* r
86 李子色 #EAADEA
& |( n/ E9 x. r, u87 石英色 #D9D9F3
2 K) u! e  d. F88 艳蓝色 #5959AB . k# V- g. ?% G! |, e3 I7 [8 l
89 鲑鱼色 #6F4242 ' P: O. W  K/ Z2 ]' u2 e
90 猩红色 #BC1717 7 t- a8 P1 o2 e1 \- U5 m0 t
91 海绿色 #238E68 - S' [3 z, C& `8 F0 _
92 半甜巧克力色 #6B4226
. v  N. p) J) i7 O  v/ C93 赭色 #8E6B23 / X/ @) |# A4 Z! [- h5 L7 q
94 银色 #E6E8FA
(这个是银色)& u& v) L. A8 B7 G) ~
95 天蓝 #3299CC 0 Q# ^0 R' e$ F; |, l# h; G" D
96 石板蓝 #007FFF
. u1 v  Y# V1 }/ N% G3 Y/ R. ^( F2 e3 H97 艳粉红色 #FF1CAE : h6 S! M! h" b% U
98 春绿色 #00FF7F 6 [0 ~4 x$ O  Y* C: g
99 钢蓝色 #236B8E
" f" C  V; ]- u5 Q100 亮天蓝色 #38B0DE
" G3 ~1 g- |: u; t. ?! s101 棕褐色 #DB9370
5 q' Y" I) c% X- x  E! t/ M102 紫红色 #D8BFD8
" c4 ~3 M- f. [4 J103 石板蓝色 #ADEAEA 7 g. T: z9 |* k  N
104 浓深棕色 #5C4033 2 y7 ?$ x6 k& c; o3 r
105 淡浅灰色 #CDCDCD % J. |1 m+ M' M) ^- i: q0 G
106 紫罗兰色 #4F2F4F
: R1 [) {0 H" s7 f# w9 W9 X107 紫罗兰红色 #CC3299 $ `) V3 k7 c& P
108 麦黄色 #D8D8BF
" C0 l2 h% H7 b2 l4 |" W109 黄绿色 #99CC32
0 g" R% ]1 y1 F5 m: j) X& x4 h
* m. L2 }$ o1 t/ y+ W/ I, v


转载请保留当前帖子的链接:https://www.beimeilife.com/thread-17367-1-1.html 谢谢
发表于 2016-6-24 11:49 | 显示全部楼层
table=560,#ff9999]
. y- u" t& h6 H" k[tr][td]
7 M0 K* u7 T: M1 A, F0 S
0 J% `3 _# k" I  \7 Q2 ?
内容
[/td][/tr]
0 M& Q( f8 t5 x( B3 Q, m[/table<p></p>; @& V1 ^! ]4 E5 i3 \

+ [' f2 B! q, u$ y3 z% L/ c2 M, B( w4 }9 K& g
?
发表于 2016-6-24 11:54 | 显示全部楼层
http://sq.k12.com.cn/discuz/blog-1040829-9709.html

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

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

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

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