|
CSS 颜色大全 css 字体颜色,将颜色代码代替css里面的颜色，就可以。 div中控制某段字体 颜色) C, q/ ~. z I
html代码$ m9 }$ Q" a0 S; f4 c
<div id="sidebar">1 t0 k% H. S8 b2 x; \; r
<span>CSS 颜色大全 css 字体颜色</span></div>
2 U' |! S9 P# Z9 r3 GCSS文件+ X9 T3 G% S2 Z/ g% Y
#sidebar { }
* ?! H9 {. }( g3 b8 {& @% N#sidebar .span{ color:#FF0000 } 1 白色 #FFFFFF | 2 红色 #FF0000 | 3 绿色 #00FF00
" L" Y6 M0 e7 U% E0 T' T7 X- o | 4 蓝色 #0000FF | 5 牡丹红 #FF00FF | 6 青色 #00FFFF- R: k0 O% P3 k9 X* n1 g
| 7 黄色 #FFFF00 | 8 黑色 #000000 | 9 海蓝 #70DB93: h2 F' Y% R+ d Y
| 10 巧克力色 #5C3317 | 11 蓝紫色 #9F5F9F | 12 黄铜色 #B5A642 | 13 亮金色 #D9D919 | 14 棕色 #A67D3D | 15 青铜色 #8C7853 | 2 M/ E" s& M7 u* K+ _
& O9 `- M6 {4 v7 W+ _
16 2号青铜色 #A67D3D
2 s& A$ {) R; @9 K' I; S | 17 士官服蓝色 #5F9F9F | 18 冷铜色 #D98719 | 19 铜色 #B87333 | 20 珊瑚红 #FF7F00 | 21 紫蓝色 #42426F | 22 深棕 #5C4033 | 23 深绿 #2F4F2F | 24 深铜绿色 #4A766E | 25 深橄榄绿 #4F4F2F | 26 深兰花色 #9932CD8 ^) @; p9 I1 j( T8 i- G
| 27 深紫色 #871F78 | 28 深石板蓝 #6B238E | 29 深铅灰色 #2F4F4F | 30 深棕褐色 #97694F | 32 深绿松石色 #7093DB | 32 深绿松石色 #7093DB | 33 暗木色 #855E42 | 34 淡灰色 #545454 | 35 土灰玫瑰红色#856363 | 36 长石色 #D19275( l, v" ~2 ^6 k5 u3 Q# h5 Q; P
| 37 火砖色 #8E2323 | 62 褐红色 #8E236B | 63 中海蓝色 #32CD99 | 64 中蓝色 #3232CD | 65 中森林绿 #6B8E23/ n. U0 T t' {* c6 d9 W3 m7 \
| 66 中鲜黄色 #EAEAAE | 67 中兰花色 #9370DB | 68 中海绿色 #426F42 | 69 中石板蓝色 #7F00FF | 70 中春绿色 #7FFF00 | 71 中绿松石色 #70DBDB | 72 中紫红色 #DB7093 | 73 中木色 #A68064 | 74 深藏青色 #2F2F4F | 75 海军蓝 #23238E- Q! x9 K* t& f0 r$ u
| 76 霓虹篮 #4D4DFF | 77 霓虹粉红 #FF6EC7 | 78 新深藏青色 #00009C | 79 新棕褐色 #EBC79E | 80 暗金黄色 #CFB53B | 81 橙色 #FF7F00 | 82 橙红色 #FF2400 | 83 淡紫色 #DB70DB | 84 浅绿色 #8FBC8F |
1 `, k; o4 C8 r5 R- s- p: B- }85 粉红色 #BC8F8F
7 ]* i2 k6 {7 c7 }0 ^" K# T
| 86 李子色 #EAADEA | 87 石英色 #D9D9F3 | 88 艳蓝色 #5959AB | 89 鲑鱼色 #6F4242 | 90 猩红色 #BC1717* {: P- }% r S' T
| 91 海绿色 #238E68 | 92 半甜巧克力色#6B4226 | 93 赭色 #8E6B23 | 94 银色 #E6E8FA | 95 天蓝 #3299CC | 96 石板蓝 #007FFF | 97 艳粉红色 #FF1CAE | 98 春绿色 #00FF7F | 99 钢蓝色 #236B8E | 100 亮天蓝色 #38B0DE
' E7 I' `7 H( G8 |) ], f | 101 棕褐色 #DB9370 | 102 紫红色 #D8BFD8 | 103 石板蓝色 #ADEAEA | 104 浓深棕色 #5C4033 | 105 淡浅灰色 #CDCDCD | 106 紫罗兰色#4F2F4F | 107 紫罗兰红色 #CC3299 | 108 麦黄色 #D8D8BF | 109 黄绿色 #99CC |
; B; y; J' s% e9 I4 G. f1 V/ K | 5 v1 Q! g, e6 A5 N: G3 s
| 3 F' t# _9 |# A. V# ?
|
, \2 R( K7 [' q |
5 `5 S8 F( K$ p r |
css样式大全(整理版） 字体属性：(font)9 ]6 N1 V' Q# F7 c$ K7 S1 k
大小 {font-size:x-large;}(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD
3 ]+ U y, [6 D9 N样式 {font-style blique;}(偏斜体) italic;(斜体) normal;(正常)
7 [# w( o ^( v* L行高 {line-height:normal;}(正常) 单位：PX、PD、EM5 z, R# K* Z$ n* a) v
粗细 {font-weight:bold;}(粗体) lighter;(细体) normal;(正常)
7 L ]# A% c9 ]- o$ E变体 {font-variant:small-caps;}(小型大写字母) normal;(正常)3 `" F. [' a: g g" |# L0 F
大小写 {text-transform:capitalize;}(首字母大写) uppercase;(大写) lowercase;(小写) none;(无). c: V5 u8 {" e. e- Z
修饰{text-decoration: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 常用字体： (font-family)
0 T; [7 H9 [( N+ G2 G: ^"Courier New", Courier, monospace, "Times New Roman",Times, serif, Arial, Helvetica, sans-serif, Verdana 背景属性： (background)
2 a7 V9 N' H" W, M% X ]色彩{background-color: #FFFFFF;}; ^: n) k3 T% g& |2 d
图片{background-image: url();}% e$ U! X0 O5 |( ^1 m
重复{background-repeat: no-repeat;}; P% ]4 X. n% G
滚动{background-attachment: fixed;}(固定) scroll;(滚动)
; P* W4 b2 `* B位置{background-position: left;}(水平) top(垂直);0 @: B# Z# V* u U
简写方法 {background:#000url(..) repeat fixed left top;} /*简写·这个在阅读代码中经常出现，要认真的研究*/ 区块属性： (Block) /*这个属性第一次认识，要多多研究*/ m1 v# |9 V" L: |" b, X3 z
字间距 {letter-spacing:normal;} 数值 /*这个属性似乎有用，多实践下*/
: _1 I O `$ e- O( o对齐 {text-align:justify;}(两端对齐) left;(左对齐) right;(右对齐) center;(居中)
1 K8 l) i* X; a4 r7 p+ B& r% r* b. Z缩进 {text-indent: 数值px;}
3 _/ i$ `4 N# q: Q8 @+ t3 l垂直对齐 {vertical-align:baseline;}(基线) sub;(下标) super;(下标) top; text-top;middle; bottom; text-bottom;* r# Q4 ]% t+ [, b' x' E7 n+ M
词间距word-spacing:normal; 数值
. G( d7 j0 V2 i4 d/ M2 r0 b7 s0 M3 u" e空格white-space:pre;(保留) nowrap;(不换行) 显示{display:block;}(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table;inline-table; table-raw-group; table-header-group; table-footer-group;table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题) /*display 属性的了解很模糊*/ 方框属性： (Box)7 N6 Q# P0 t* z# a
width:;height:; float:; clear:both; margin:; padding:; 顺序：上右下左! ^( `; F) j0 ?' S) Z+ ^. s
边框属性： (Border)
1 Q5 N8 o( ~+ ~& T. vborder-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;
* ]7 }) X# W9 A% a- v% i! uborder-width:; 边框宽度; R: @6 N- ~; E5 T9 z' B
border-color:#; 简写方法border：width stylecolor; /*简写*/ 列表属性： (List-style)
# K* a' `8 ?6 M; F- F. m# T类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman;lower-alpha; upper-alpha;' I J* I9 ?7 S1 I9 n) t8 [. k+ c
位置list-style-positionutside;(外) inside;
/ g U$ n& v+ Y$ w图像list-style-image:url(..);
( `& |# X. D O1 _定位属性：(Position)
7 H. Q, C7 x' L0 J. [& ZPosition:absolute; relative; static;/ T- _' u& x0 n
visibility: inherit; visible; hidden;. e2 S, b5 A/ D8 y+ W+ N! H
overflow: visible; hidden; scroll; auto;
) i. D# t) g. O1 Aclip: rect(12px,auto,12px,auto) (裁切) css属性代码大全$ A2 ~ v7 z: E! ?
一 CSS文字属性：/ M6 u, {2 x4 |7 T/ N
color : #999999; /*文字颜色*/
0 X- W& H* F; V: w5 mfont-family : 宋体,sans-serif; /*文字字体*/
; R7 R- j8 b4 U+ I. E& ], J1 _. f9 W7 f3 z font-size : 9pt; /*文字大小*/& |% ?" n! K2 b1 y& S
font-style:itelic; /*文字斜体*/9 V; M$ e& ^# q+ ^' |
font-variant:small-caps; /*小字体*/
* Z; V& j* e6 Y3 j% U letter-spacing : 1pt; /*字间距离*/
" p6 h" O7 [& [3 G4 h line-height : 200%; /*设置行高*/
' `2 H: E* Z0 K+ I5 o: m2 x font-weight:bold; /*文字粗体*/7 C% K' `, w9 M4 B; h7 l
vertical-align:sub; /*下标字*/( g [$ m$ w; n
vertical-align:super; /*上标字*/
" N* R- w& U" V& D, O' i4 x/ H text-decoration:line-through; /*加删除线*/
4 `( [9 }* `4 S5 f5 c6 R text-decoration: overline; /*加顶线*/0 G; s) @/ J" \1 |$ U
text-decoration:underline; /*加下划线*/ u0 x& \$ x' w w. ]4 V& s' s h
text-decoration:none; /*删除链接下划线*/8 m# u; G+ s' O6 X
text-transform : capitalize; /*首字大写*/
9 D/ m. V1 _7 o8 f* s text-transform : uppercase; /*英文大写*/
$ x) W/ M$ i2 v& m text-transform : lowercase; /*英文小写*/( f0 [/ L" t/ j; h/ p6 r
text-align:right; /*文字右对齐*/
9 R) J* r& d% n; w1 M text-align:left; /*文字左对齐*/3 M' E. M8 p$ ]
text-align:center; /*文字居中对齐*/% B, O. R8 Q/ L4 O: b3 L
text-align:justify; /*文字分散对齐*/
7 b2 J: O# g2 b# L) o vertical-align属性
% J" }5 o2 y% Z, z; |; _& N! Svertical-align:top; /*垂直向上对齐*/: L% C6 K- u9 z5 ]1 Q) S
vertical-align:bottom; /*垂直向下对齐*/. Q8 h4 _! D8 \7 S) g8 j
vertical-align:middle; /*垂直居中对齐*/
* E: A4 {! `; R: ]+ ]2 l% \# [1 a vertical-align:text-top; /*文字垂直向上对齐*/: v% b4 X0 m1 v- A- n
vertical-align:text-bottom; /*文字垂直向下对齐*/ CSS 属性： 字体样式(Font Style)5 w7 p& G) p; X
序号中文说明标记语法1 Q5 M: O& N3 J T0 N; d8 z0 I0 p
1 字体样式 {font:font-style font-variant font-weight font-sizefont-family}; M: r* t6 F0 X7 B4 C; \2 K
2 字体类型 {font-family:"字体1","字体2","字体3",...}7 l! u- B3 O, X5 x7 [- B. \
3 字体大小 {font-size:数值|inherit| medium| large| larger| x-large| xx-large|small| smaller| x-small| xx-small}7 _7 Q* M E, @. P
4 字体风格 {font-style:inherit|italic|normal|oblique}
4 ?& e; n) q5 `" J! }+ a2 n* t8 `* _ 5 字体粗细 {font-weight:100-900|bold|bolder|lighter|normal;}, {. s" \# D, l6 w1 B
6 字体颜色 {color:数值;}
9 h6 e7 O2 y2 u$ t; [* v9 @+ V c2 a9 U 7 阴影颜色 {text-shadow:16位色值}) J, X: E( m$ q( k& k
8 字体行高 {line-height:数值|inherit|normal;}
) v8 y- n/ L7 \/ Z w7 ]! q 9 字 间 距 {letter-spacing:数值|inherit|normal}! g K: Q* j3 l7 m) d
10 单词间距 {word-spacing:数值|inherit|normal}
6 D8 X) \+ a0 m- y8 W 11 字体变形 {font-variant:inherit|normal|small-cps }/ O- m- ?3 S; L2 p
12 英文转换 {text-transform:inherit|none|capitalize|uppercase|lowercase}( R4 ^: W$ o# d9 a
13 字体变形 {font-size-adjust:inherit|none}
& |3 o, I* l) V/ Y' Q 14 字体{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal|semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}2 }7 n( M4 r* c+ ]8 y4 r
文本样式(Text Style). _- x5 E7 F( ~5 ~
序号中文说明标记语法6 N6 ?2 S, T5 p3 |
1 行 间 距 {line-height:数值|inherit|normal;}0 K; I. U, f# M0 J
2 文本修饰{text-decoration:inherit|none|underline|overline|line-through|blink}# S" y4 A: A' `6 e( W, t
3 段首空格 {text-indent:数值|inherit}/ m4 L- _3 L) T+ Q: O. t; u
4 水平对齐 {text-align:left|right|center|justify}
3 Y% B# N1 M/ \4 g2 q3 ? 5 垂直对齐 {vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}* a2 j; Q% _7 D8 v
6 书写方式 {writing-mode:lr-tb|tb-rl}2 O! R) T+ z. ~. e
; A" `/ f% m0 V0 ` D4 L; t | 
发表于 2018-2-2 22:37:43
