CSSè¯è¨å¤§å
¨ï¼å¦ä¸ï¼
åä½å±æ§ï¼(font)
å¤§å° {font-size: x-large;}(ç¹å¤§) xx-small;(æå°) ä¸è¬ä¸æç¨ä¸å°ï¼åªè¦ç¨æ°å¼å°±å¯ä»¥ï¼åä½ï¼PXãPD
æ ·å¼ {font-style: oblique;}(åæä½) italic;(æä½) normal;(æ£å¸¸)
è¡é« {line-height: normal;}(æ£å¸¸) åä½ï¼PXãPDãEM
ç²ç» {font-weight: bold;}(ç²ä½) lighter;(ç»ä½) normal;(æ£å¸¸)
åä½ {font-variant: small-caps;}(å°å大ååæ¯) normal;(æ£å¸¸)
大å°å {text-transform: capitalize;}(é¦åæ¯å¤§å) uppercase;(大å) lowercase;(å°å) none;(æ )
修饰 {text-decoration: underline;}(ä¸å线) overline;(ä¸å线) line-through;(å é¤çº¿) blink;(éªç)
常ç¨åä½ï¼ (font-family)
"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana
èæ¯å±æ§ï¼ (background)
è²å½© {background-color: #FFFFFF;}
å¾ç {background-image: url();}
éå¤ {background-repeat: no-repeat;}
æ»å¨ {background-attachment: fixed;}(åºå®) scroll;(æ»å¨)
ä½ç½® {background-position: left;}(æ°´å¹³) top(åç´);
ç®åæ¹æ³ {background:#000 url(..) repeat fixed left top;} /*ç®å·è¿ä¸ªå¨é
读代ç ä¸ç»å¸¸åºç°ï¼è¦è®¤ççç 究*/
åºåå±æ§ï¼ (Block) /*è¿ä¸ªå±æ§ç¬¬ä¸æ¬¡è®¤è¯ï¼è¦å¤å¤ç 究*/
åé´è· {letter-spacing: normal;} æ°å¼ /*è¿ä¸ªå±æ§ä¼¼ä¹æç¨ï¼å¤å®è·µä¸*/
å¯¹é½ {text-align: justify;}(两端对é½) left;(左对é½) right;(å³å¯¹é½) center;(å±
ä¸)
ç¼©è¿ {text-indent: æ°å¼px;}
åç´å¯¹é½ {vertical-align: baseline;}(åºçº¿) sub;(ä¸æ ) super;(ä¸æ ) top; text-top; middle; bottom; text-bottom;
è¯é´è·word-spacing: normal; æ°å¼
ç©ºæ ¼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)
width:; height:; float:; clear:both; margin:; padding:; 顺åºï¼ä¸å³ä¸å·¦
è¾¹æ¡å±æ§ï¼ (Border)
border-style: dotted;(ç¹çº¿) dashed;(è线) solid; double;(å线) groove;(槽线) ridge;(èç¶) inset;(å¹é·) outset;
border-width:; è¾¹æ¡å®½åº¦
border-color:#;
ç®åæ¹æ³borderï¼width style color; /*ç®å*/
å表å±æ§ï¼ (List-style)
ç±»ålist-style-type: disc;(åç¹) circle;(åå) square;(æ¹å) decimal;(æ°å) lower-roman;(å°ç½ç æ°å) upper-roman; lower-alpha; upper-alpha;
ä½ç½®list-style-position: outside;(å¤) inside;
å¾ålist-style-image: url(..);
å®ä½å±æ§ï¼ (Position)
Position: absolute; relative; static;
visibility: inherit; visible; hidden;
overflow: visible; hidden; scroll; auto;
clip: rect(12px,auto,12px,auto) (è£å)
csså±æ§ä»£ç 大å
¨
ä¸ CSSæåå±æ§ï¼
color : #999999; /*æåé¢è²*/
font-family : å®ä½,sans-serif; /*æååä½*/
font-size : 9pt; /*æå大å°*/
font-style:itelic; /*æåæä½*/
font-variant:small-caps; /*å°åä½*/
letter-spacing : 1pt; /*åé´è·ç¦»*/
line-height : 200%; /*设置è¡é«*/
font-weight:bold; /*æåç²ä½*/
vertical-align:sub; /*ä¸æ å*/
vertical-align:super; /*ä¸æ å*/
text-decoration:line-through; /*å å é¤çº¿*/
text-decoration: overline; /*å 顶线*/
text-decoration:underline; /*å ä¸å线*/
text-decoration:none; /*å é¤é¾æ¥ä¸å线*/
text-transform : capitalize; /*é¦å大å*/
text-transform : uppercase; /*è±æ大å*/
text-transform : lowercase; /*è±æå°å*/
text-align:right; /*æåå³å¯¹é½*/
text-align:left; /*æå左对é½*/
text-align:center; /*æåå±
ä¸å¯¹é½*/
text-align:justify; /*æååæ£å¯¹é½*/
vertical-alignå±æ§
vertical-align:top; /*åç´åä¸å¯¹é½*/
vertical-align:bottom; /*åç´åä¸å¯¹é½*/
vertical-align:middle; /*åç´å±
ä¸å¯¹é½*/
vertical-align:text-top; /*æååç´åä¸å¯¹é½*/
vertical-align:text-bottom; /*æååç´åä¸å¯¹é½*/
äºãCSSè¾¹æ¡ç©ºç½
padding-top:10px; /*ä¸è¾¹æ¡ç空ç½*/
padding-right:10px; /*å³è¾¹æ¡ç空ç½*/
padding-bottom:10px; /*ä¸è¾¹æ¡ç空ç½*/
padding-left:10px; /*左边æ¡ç空ç½
ä¸ãCSS符å·å±æ§ï¼
list-style-type:none; /*ä¸ç¼å·*/
list-style-type:decimal; /*é¿æ伯æ°å*/
list-style-type:lower-roman; /*å°åç½é©¬æ°å*/
list-style-type:upper-roman; /*大åç½é©¬æ°å*/
list-style-type:lower-alpha; /*å°åè±æåæ¯*/
list-style-type:upper-alpha; /*大åè±æåæ¯*/
list-style-type:disc; /*å®å¿å形符å·*/
list-style-type:circle; /*空å¿å形符å·*/
list-style-type:square; /*å®å¿æ¹å½¢ç¬¦å·*/
list-style-image:url(/dot.gif); /*å¾çå¼ç¬¦å·*/
list-style-position: outside; /*å¸æ*/
list-style-position:inside; /*缩è¿*/
åãCSSèæ¯æ ·å¼ï¼
background-color:#F5E2EC; /*èæ¯é¢è²*/
background:transparent; /*éè§èæ¯*/
background-image : url(/image/bg.gif); /*èæ¯å¾ç*/
background-attachment : fixed; /*浮水å°åºå®èæ¯*/
background-repeat : repeat; /*éå¤æå-ç½é¡µé»è®¤*/
background-repeat : no-repeat; /*ä¸éå¤æå*/
background-repeat : repeat-x; /*å¨xè½´éå¤æå*/
background-repeat : repeat-y; /*å¨yè½´éå¤æå*/
æå®èæ¯ä½ç½®
background-position : 90% 90%; /*èæ¯å¾çxä¸yè½´çä½ç½®*/
background-position : top; /*åä¸å¯¹é½*/
background-position : buttom; /*åä¸å¯¹é½*/
background-position : left; /*å左对é½*/
background-position : right; /*åå³å¯¹é½*/
background-position : center; /*å±
ä¸å¯¹é½*/
äºãCSSè¿æ¥å±æ§ï¼
a /*ææè¶
é¾æ¥*/
a:link /*è¶
é¾æ¥æåæ ¼å¼*/
a:visited /*æµè§è¿çé¾æ¥æåæ ¼å¼*/
a:active /*æä¸é¾æ¥çæ ¼å¼*/
a:hover /*é¼ æ 转å°é¾æ¥*/
é¼ æ å
æ æ ·å¼ï¼
é¾æ¥ææ CURSOR: hand
ååä½ cursor:crosshair
ç®å¤´æä¸ cursor:s-resize
ååç®å¤´ cursor:move
ç®å¤´æå³ cursor:move
å ä¸é®å· cursor:help
ç®å¤´æå·¦ cursor:w-resize
ç®å¤´æä¸ cursor:n-resize
ç®å¤´æå³ä¸ cursor:ne-resize
ç®å¤´æå·¦ä¸ cursor:nw-resize
æåIå cursor:text
ç®å¤´æå³ä¸ cursor:se-resize
ç®å¤´æå·¦ä¸ cursor:sw-resize
æ¼æ cursor:wait
å
æ å¾æ¡(IE6) p {cursor:url("å
æ æ件å.cur"),text;}
å
ãCSSæ¡çº¿ä¸è§è¡¨ï¼
border-top : 1px solid #6699cc; /*ä¸æ¡çº¿*/
border-bottom : 1px solid #6699cc; /*ä¸æ¡çº¿*/
border-left : 1px solid #6699cc; /*å·¦æ¡çº¿*/
border-right : 1px solid #6699cc; /*å³æ¡çº¿*/
以ä¸æ¯å»ºè®®ä¹¦åæ¹å¼,ä½ä¹å¯ä»¥ä½¿ç¨å¸¸è§çæ¹å¼ å¦ä¸:
border-top-color : #369 /*设置ä¸æ¡çº¿topé¢è²*/
border-top-width :1px /*设置ä¸æ¡çº¿top宽度*/
border-top-style : solid/*设置ä¸æ¡çº¿topæ ·å¼*/
å
¶ä»æ¡çº¿æ ·å¼
solid /*å®çº¿æ¡*/
dotted /*è线æ¡*/
double /*å线æ¡*/
groove /*ç«ä½å
å¸æ¡*/
ridge /*ç«ä½æµ®éæ¡*/
inset /*å¹æ¡*/
outset /*å¸æ¡*/
ä¸ãCSS表åè¿ç¨ï¼
æåæ¹å
æé®
å¤éæ¡
éæ©é®
å¤è¡æåæ¹å
ä¸æå¼èå é项1é项2
å
«ãCSSè¾¹çæ ·å¼ï¼
margin-top:10px; /*ä¸è¾¹ç*/
margin-right:10px; /*å³è¾¹çå¼*/
margin-bottom:10px; /*ä¸è¾¹çå¼*/
margin-left:10px; /*左边çå¼*/
CSS å±æ§ï¼ åä½æ ·å¼(Font Style)
åºå· ä¸æ说æ æ è®°è¯æ³
1 åä½æ ·å¼ {font:font-style font-variant font-weight font-size font-family}
2 åä½ç±»å {font-family:"åä½1","åä½2","åä½3",...}
3 åä½å¤§å° {font-size:æ°å¼|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small}
4 åä½é£æ ¼ {font-style:inherit|italic|normal|oblique}
5 åä½ç²ç» {font-weight:100-900|bold|bolder|lighter|normal;}
6 åä½é¢è² {color:æ°å¼;}
7 é´å½±é¢è² {text-shadow:16ä½è²å¼}
8 åä½è¡é« {line-height:æ°å¼|inherit|normal;}
9 å é´ è· {letter-spacing:æ°å¼|inherit|normal}
10 åè¯é´è· {word-spacing:æ°å¼|inherit|normal}
11 åä½åå½¢ {font-variant:inherit|normal|small-cps }
12 è±æè½¬æ¢ {text-transform:inherit|none|capitalize|uppercase|lowercase}
13 åä½åå½¢ {font-size-adjust:inherit|none}
14 åä½ {font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}
ææ¬æ ·å¼(Text Style)
åºå· ä¸æ说æ æ è®°è¯æ³
1 è¡ é´ è· {line-height:æ°å¼|inherit|normal;}
2 ææ¬ä¿®é¥° {text-decoration:inherit|none|underline|overline|line-through|blink}
3 段é¦ç©ºæ ¼ {text-indent:æ°å¼|inherit}
4 æ°´å¹³å¯¹é½ {text-align:left|right|center|justify}
5 åç´å¯¹é½ {vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}
6 书åæ¹å¼ {writing-mode:lr-tb|tb-rl}
èæ¯æ ·å¼
åºå· ä¸æ说æ æ è®°è¯æ³
1 èæ¯é¢è² {background-color:æ°å¼}
2 èæ¯å¾ç {background-image: url(URL)|none}
3 èæ¯éå¤ {background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}
4 èæ¯åºå® {background-attachment:fixed|scroll}
5 èæ¯å®ä½ {background-position:æ°å¼|top|bottom|left|right|center}
6 èå½±æ ·å¼ {background:èæ¯é¢è²|èæ¯å¾è±¡|èæ¯éå¤|èæ¯é件|èæ¯ä½ç½®}
æ¡æ¶æ ·å¼(Box Style)
åºå· ä¸æ说æ æ è®°è¯æ³
1 è¾¹ççç½ {margin:margin-top margin-right margin-bottom margin-left}
2 è¡¥ããç½ {padding:padding-top padding-right padding-bottom padding-left}
3 è¾¹æ¡å®½åº¦ {border-width:border-top-width border-right-width border-bottom-width border-left-width}ãã
宽度å¼ï¼ thin|medium|thick|æ°å¼
4 è¾¹æ¡é¢è² {border-color:æ°å¼ æ°å¼ æ°å¼ æ°å¼}ããæ°å¼ï¼åå«ä»£è¡¨topãrightãbottomãlefté¢è²å¼
5 è¾¹æ¡é£æ ¼ {border-style:none|hidden|inherit|dashed|solid|double|inset|outset|ridge|groove}
6 è¾¹ããæ¡ {border:border-width border-style color}
ä¸ è¾¹ æ¡ {border-top:border-top-width border-style color}
å³ è¾¹ æ¡ {border-right:border-right-width border-style color}
ä¸ è¾¹ æ¡ {border-bottom:border-bottom-width border-style color}
å·¦ è¾¹ æ¡ {border-left:border-left-width border-style color}
7 宽ãã度 {width:é¿åº¦|ç¾åæ¯| auto}
8 é«ãã度 {height:æ°å¼|auto}
9 æ¼ããæµ® {float:left|right|none}
10 æ¸
ããé¤ {clear:none|left|right|both}
åç±»å表
åºå· ä¸æ说æ æ è®°è¯æ³
1 æ§å¶æ¾ç¤º {display:none|block|inline|list-item}
2 æ§å¶ç©ºç½ {white-space:normal|pre|nowarp}
3 符å·å表 {list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none}
4 å¾å½¢å表 {list-style-image:URL}
5 ä½ç½®å表 {list-style-position:inside|outside}
6 ç®å½å表 {list-style:ç®å½æ ·å¼ç±»å|ç®å½æ ·å¼ä½ç½®|url}
7 é¼ æ å½¢ç¶ {cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}
温馨提示:答案为网友推荐,仅供参考