CSS 颜色大全 css 字体颜色,将颜色代码代替css里面的颜色,就可以。 div中控制某段字体 颜色. u" s2 U! w+ i0 K- m
html代码
9 ]4 g+ m1 i6 G, `9 |<div id="sidebar">6 T8 M) p7 }5 C. T( d
<span>CSS 颜色大全 css 字体颜色</span></div>
- `- U! f3 x& @, F" BCSS文件; s4 n% C; q- i* K# W
#sidebar { }
/ A! G0 ^* u0 c- V1 n#sidebar .span{ color:#FF0000 } 1 白色 #FFFFFF | 2 红色 #FF0000 | 3 绿色 #00FF00
0 S, s' s5 ~' r, M5 z | 4 蓝色 #0000FF | 5 牡丹红 #FF00FF | 6 青色 #00FFFF
- A+ W/ _8 k$ ~) @, R+ J* [ | 7 黄色 #FFFF00 | 8 黑色 #000000 | 9 海蓝 #70DB93
6 N1 G3 S" x Q; K, n' ^+ p' T | 10 巧克力色 #5C3317 | 11 蓝紫色 #9F5F9F | 12 黄铜色 #B5A642 | 13 亮金色 #D9D919 | 14 棕色 #A67D3D | 15 青铜色 #8C7853 |
, i9 X+ q' V* V
/ q5 W* V" l/ o2 \5 p" w. o 16 2号青铜色 #A67D3D# O: |. _- z9 O! ^
| 17 士官服蓝色 #5F9F9F | 18 冷铜色 #D98719 | 19 铜色 #B87333 | 20 珊瑚红 #FF7F00 | 21 紫蓝色 #42426F | 22 深棕 #5C4033 | 23 深绿 #2F4F2F | 24 深铜绿色 #4A766E | 25 深橄榄绿 #4F4F2F | 26 深兰花色 #9932CD
' u. _2 M2 ~3 \; ^- B | 27 深紫色 #871F78 | 28 深石板蓝 #6B238E | 29 深铅灰色 #2F4F4F | 30 深棕褐色 #97694F | 32 深绿松石色 #7093DB | 32 深绿松石色 #7093DB | 33 暗木色 #855E42 | 34 淡灰色 #545454 | 35 土灰玫瑰红色#856363 | 36 长石色 #D19275) k2 G) R) E& P. o$ [9 ]
| 37 火砖色 #8E2323 | 62 褐红色 #8E236B | 63 中海蓝色 #32CD99 | 64 中蓝色 #3232CD | 65 中森林绿 #6B8E23! m9 V7 F7 i2 g/ n3 b5 S" c- a6 H
| 66 中鲜黄色 #EAEAAE | 67 中兰花色 #9370DB | 68 中海绿色 #426F42 | 69 中石板蓝色 #7F00FF | 70 中春绿色 #7FFF00 | 71 中绿松石色 #70DBDB | 72 中紫红色 #DB7093 | 73 中木色 #A68064 | 74 深藏青色 #2F2F4F | 75 海军蓝 #23238E
8 g! \& V z0 W | 76 霓虹篮 #4D4DFF | 77 霓虹粉红 #FF6EC7 | 78 新深藏青色 #00009C | 79 新棕褐色 #EBC79E | 80 暗金黄色 #CFB53B | 81 橙色 #FF7F00 | 82 橙红色 #FF2400 | 83 淡紫色 #DB70DB | 84 浅绿色 #8FBC8F | # ^% S& H9 p+ S7 L
85 粉红色 #BC8F8F
2 m! w( Q; b9 E2 ^) o0 c; b | 86 李子色 #EAADEA | 87 石英色 #D9D9F3 | 88 艳蓝色 #5959AB | 89 鲑鱼色 #6F4242 | 90 猩红色 #BC1717
- }$ x5 B* X/ R" }9 e | 91 海绿色 #238E68 | 92 半甜巧克力色#6B4226 | 93 赭色 #8E6B23 | 94 银色 #E6E8FA | 95 天蓝 #3299CC | 96 石板蓝 #007FFF | 97 艳粉红色 #FF1CAE | 98 春绿色 #00FF7F | 99 钢蓝色 #236B8E | 100 亮天蓝色 #38B0DE* |5 z) b) M) p
| 101 棕褐色 #DB9370 | 102 紫红色 #D8BFD8 | 103 石板蓝色 #ADEAEA | 104 浓深棕色 #5C4033 | 105 淡浅灰色 #CDCDCD | 106 紫罗兰色#4F2F4F | 107 紫罗兰红色 #CC3299 | 108 麦黄色 #D8D8BF | 109 黄绿色 #99CC |
7 B# v. |) S M5 m |
} _# ^% @2 v3 X. r |
$ P1 c* | V6 Q8 J% J W | , m0 v% V( X2 |1 q
|
; v$ p P M$ n. j4 w. y |
css样式大全(整理版) 字体属性:(font)
7 h n [7 v2 l/ E3 I4 K/ C大小 {font-size:x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX、PD
# f, n- h5 F) C M$ c/ n; ^" W样式 {font-style blique;}(偏斜体) italic;(斜体) normal;(正常)
# k, r. O% z% ?5 m/ U* m3 z行高 {line-height:normal;}(正常) 单位:PX、PD、EM
( v0 u# F$ \$ Z. @* K4 K+ ]粗细 {font-weight:bold;}(粗体) lighter;(细体) normal;(正常)' P$ ]5 h9 x( U
变体 {font-variant:small-caps;}(小型大写字母) normal;(正常)
4 H+ J: o8 x. t/ W大小写 {text-transform:capitalize;}(首字母大写) uppercase;(大写) lowercase;(小写) none;(无)
2 v; E* P5 r- ? d7 ?! r修饰{text-decoration: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 常用字体: (font-family)
: E1 \7 n& Y8 \4 C/ j2 H"Courier New", Courier, monospace, "Times New Roman",Times, serif, Arial, Helvetica, sans-serif, Verdana 背景属性: (background)1 R$ m# O0 ?/ I |5 q( M3 V0 @
色彩{background-color: #FFFFFF;}! L, J! |: d. P: T0 O- @
图片{background-image: url();}
' O' A, m3 U% f8 A% y9 q重复{background-repeat: no-repeat;}
; j: k& n, S' ]7 N) Z( j滚动{background-attachment: fixed;}(固定) scroll;(滚动)8 {4 y5 F) d, r( i1 F: n, `4 q
位置{background-position: left;}(水平) top(垂直);# G6 n8 m5 [' D# [" j0 V
简写方法 {background:#000url(..) repeat fixed left top;} /*简写·这个在阅读代码中经常出现,要认真的研究*/ 区块属性: (Block) /*这个属性第一次认识,要多多研究*/ P- F) f/ Y/ y
字间距 {letter-spacing:normal;} 数值 /*这个属性似乎有用,多实践下*/6 f* y a6 r# V! B* C$ Z4 h
对齐 {text-align:justify;}(两端对齐) left;(左对齐) right;(右对齐) center;(居中)
" x9 a$ S& X+ ^8 ]3 j( w h4 ]$ T缩进 {text-indent: 数值px;}# q! M7 h! H) `2 g2 r5 N6 |
垂直对齐 {vertical-align:baseline;}(基线) sub;(下标) super;(下标) top; text-top;middle; bottom; text-bottom;
7 [, ~1 ^: x& z; V% Z词间距word-spacing:normal; 数值
. H5 Q! M' ?) ?( @! v& L空格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)1 {) ~6 X; G9 ~
width:;height:; float:; clear:both; margin:; padding:; 顺序:上右下左
2 J- J+ B" ?% m9 A' B边框属性: (Border)
& Z/ C; L5 ?+ A7 N zborder-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;% W9 @7 ~8 R+ Q% Z, N
border-width:; 边框宽度. V8 G0 g, @8 N" o1 `
border-color:#; 简写方法border:width stylecolor; /*简写*/ 列表属性: (List-style)- d7 L# q# T4 t3 W) ~+ X$ _
类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman;lower-alpha; upper-alpha;1 N( P2 Y/ K1 K# {) T
位置list-style-position utside;(外) inside;
* i2 x7 T4 V$ q, D% X1 i8 f图像list-style-image:url(..);
9 ^7 i2 ~8 f! L定位属性:(Position)
D$ @8 q6 ]5 |5 O0 J yPosition:absolute; relative; static;
; S# }; c' ?- ?* Mvisibility: inherit; visible; hidden;* h! f8 B5 r$ o9 B
overflow: visible; hidden; scroll; auto;8 I' _; v& W* P$ o
clip: rect(12px,auto,12px,auto) (裁切) css属性代码大全+ K& }. l* \7 F- ^, C& F
一 CSS文字属性:4 \8 \1 i0 @4 s
color : #999999; /*文字颜色*/. c( g' T1 s. @( X# B( u
font-family : 宋体,sans-serif; /*文字字体*/
6 ~5 G( {/ a, J1 l font-size : 9pt; /*文字大小*/ Y, B8 s1 n4 U- @5 G* V
font-style:itelic; /*文字斜体*/
: `8 s; d$ k9 e. C7 l! n font-variant:small-caps; /*小字体*/
+ b; y# h! Q ~2 U. Y2 T letter-spacing : 1pt; /*字间距离*/( n/ V4 j( V0 R7 v; l
line-height : 200%; /*设置行高*/
' x$ q4 v1 N2 o font-weight:bold; /*文字粗体*/4 d! X3 a* h/ j; g
vertical-align:sub; /*下标字*/
4 N/ k6 ?8 u. W( w. _ vertical-align:super; /*上标字*/, ~4 x3 X: q* f* M4 L! K
text-decoration:line-through; /*加删除线*/
& K2 R4 ~& \! ?4 T* g% K text-decoration: overline; /*加顶线*/
* ^. Q" U+ w4 O% O! e) M text-decoration:underline; /*加下划线*/
0 |3 y3 |# l4 }2 i text-decoration:none; /*删除链接下划线*/
8 L/ i- x& ?6 v: k5 I text-transform : capitalize; /*首字大写*/
) y' Q& V( ^$ T- H8 x text-transform : uppercase; /*英文大写*/
O& K5 h& P& e# b2 ?% q text-transform : lowercase; /*英文小写*/7 x2 ^( H; _# s: H4 Q
text-align:right; /*文字右对齐*/' l2 R& Y) }; z8 I: |: G( S) w
text-align:left; /*文字左对齐*/
/ N" N8 W7 |8 f: n7 w text-align:center; /*文字居中对齐*/+ k8 ^- O2 j5 h
text-align:justify; /*文字分散对齐*/$ _4 s X( h1 i
vertical-align属性
6 w3 \ F, F2 H" S) s- W7 a7 \1 V5 wvertical-align:top; /*垂直向上对齐*/
$ ~6 w: }: u f% ]! m vertical-align:bottom; /*垂直向下对齐*/
3 o4 F# ]9 ?7 k* e N/ p vertical-align:middle; /*垂直居中对齐*/
) H3 E( d! H! j% f* E vertical-align:text-top; /*文字垂直向上对齐*/) h# K! t9 j- s0 Z; v; s( M+ J
vertical-align:text-bottom; /*文字垂直向下对齐*/ CSS 属性: 字体样式(Font Style)1 h* D) k$ Y H/ Q. j- f
序号中文说明标记语法
: z1 }: I# B4 A9 l' f t 1 字体样式 {font:font-style font-variant font-weight font-sizefont-family}2 s9 k8 ^( B7 F" N3 U
2 字体类型 {font-family:"字体1","字体2","字体3",...}
* Y+ e) w& ]! W. y* z* A 3 字体大小 {font-size:数值|inherit| medium| large| larger| x-large| xx-large|small| smaller| x-small| xx-small}
: C2 Q# C$ D' B, I- B' d! @ 4 字体风格 {font-style:inherit|italic|normal|oblique}
0 u* v7 O1 x# B 5 字体粗细 {font-weight:100-900|bold|bolder|lighter|normal;}+ n. A1 @: I/ O4 O6 C
6 字体颜色 {color:数值;}
- Z4 k9 F' x- Q8 J" M& p3 \7 ^2 B 7 阴影颜色 {text-shadow:16位色值}
% u2 g: r' q# K% {0 Y1 \% D/ _ 8 字体行高 {line-height:数值|inherit|normal;}1 F; O( n; b& {- N
9 字 间 距 {letter-spacing:数值|inherit|normal}
+ x1 q. z) N1 q \ 10 单词间距 {word-spacing:数值|inherit|normal}" h# L8 T' p2 X; @; A# M) e
11 字体变形 {font-variant:inherit|normal|small-cps }
6 U0 s4 P" p/ t9 w4 [% s# @' R 12 英文转换 {text-transform:inherit|none|capitalize|uppercase|lowercase}! U" I5 H" b) k$ q
13 字体变形 {font-size-adjust:inherit|none}
5 f& _# j6 E0 {9 I; Z 14 字体{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal|semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}
! [9 u w- i% c O4 m& [( { 文本样式(Text Style)* h! Z7 ~8 p( S2 l8 Q. D- f
序号中文说明标记语法
) Y5 ]; i/ t9 Q# q, W* e' D 1 行 间 距 {line-height:数值|inherit|normal;}
- q8 a" p7 }- q- W 2 文本修饰{text-decoration:inherit|none|underline|overline|line-through|blink}
, `2 U0 T5 Y* D& ~! E4 b1 k9 l 3 段首空格 {text-indent:数值|inherit}$ r. }( P, @* }5 Q7 i/ @
4 水平对齐 {text-align:left|right|center|justify}6 F2 T# w3 K0 u8 ~/ s9 p* p
5 垂直对齐 {vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}
' r+ `+ `6 c. v( P) Y _) ^3 A 6 书写方式 {writing-mode:lr-tb|tb-rl}
/ V2 M4 ]1 g4 k+ Q4 _3 A: } 1 e# y* m3 m, J0 |! k8 l, ]$ d+ e
|