ÓÃCSSÉèÖÃÎı¾µÄÊôÐÔ
Ò»¡¢CSS Ö㤶ÈÓëÑÕÉ«
1¡¢³¤¶Èµ¥Î»ËµÃ÷
in Ó¢´ç
cm ¹«·Ö
mm ¹«Àï
cm ÒÔĿǰ×ÖÌå¸ß¶ÈΪµ¥Î»
ex ÒÔСд×Öĸ¸ß¶ÈΪµ¥Î»£¨´ó²¿·Ö²»Ö§³Ö£©
pt 1pt/72Ó¢´ç
pc 1pc/12pt
px ÏñËØ£¨ÍƼöʹÓã©
2¡¢ÑÕÉ«µ¥Î»£º ˵Ã÷
Ê®Áù½øÖÆÈ磺color:#ff0000
ÑÕÉ«Ãû³ÆÈ磺color:red
ÈýÔÉ«µ¥Î»È磺rgb(255,0,0)
Ò»°ã×î³£ÓõÄÊÇÊ®Áù½øÖÆ£¬ÈýÔÉ«µ¥Î»µÄÔÀí¡¾ºì£¨r£©,ÂÌ£¨g£©,À¶(b)¡¿»ìºÏ¶ø³É£¬Ã¿¸öÖµÓòÔÚ0£255Ö®¼ä
¶þ¡¢CSS ÖеÄÎÄ×ÖÊôÐÔ
font-style
normal Õý³£ÏÔʾ
italic бÌå
bold ´ÖÌå
font-size ÏñËØ×ÖÌå´óС °Ù·Ö±È×ÖÌå´óС
font-family ×ÖÌåÃû³ÆÉèÖÃ×ÖÌåÃû³Æ
font-variant
normal Õý³£ÏÔʾ
small-caps ½«Ó¢ÎÄ´óСд×Öĸдµ÷Ϊͬ¿í
font-weight normal Õý³£ÏÔʾ
fontÊôÐÔ¼ò»¯µÄʹÓ÷½·¨£º
font:ÊÇ·ñбÌåÊÇ·ñͬ¿íÊÇ·ñ´ÖÌå´óС×ÖÌåÃû³Æ
ÀýÈç:font:italic bold 200 ºÚÊ飻
Èý¡¢CSSÖеÄÎı¾ÊôÐÔ
color Ê®Áù½øÖÆÑÕÉ«¡¢Ó¢ÎÄÃû³ÆÑÕÉ«¡¢ÈýÔÉ«µ¥Î»ÑÕÉ«
letter-spacing
normal Õý³£ÏÔʾ
³¤¶È Îı¾¼ä¸ô
word-spacing
normal Õý³£ÏÔʾ
Êý×Ö µ¥´Ê¼ä¾à
white-space
normal Îı¾×Ô¶¯´¦Àí»»ÐÐ
pre »»ÐкͿհ×Êܱ£»¤
nowrap Ç¿ÖÆÔÚͬһÐÐÏÔʾ
text-align
left ÎÄ×Ö¿¿×ó
right ÎÄ×Ö¿¿ÓÒ
center ÎÄ×Ö¿¿ÖÐ
text-decoration
none Õý³£ÏÔʾ
underline ¼ÓÉÏÏ»®Ïß
overline ¼Ó¶¥Ïß
line-through ¼Óɾ³ýÏß
text-indent
³¤¶È Ê×ÐÐËõ½ø
°Ù·Ö Ê×ÐÐËõ½ø
line-height ÏñËØÐиß
Êý×Ö/°Ù·Ö±È Ðиß
text-transform
none Õý³£ÏÔʾ¿ÉÒÔ°üº¬´ó£¬Ð¡×Ö·û
capitalize ×Ö·û´®µÚÒ»¸ö×Ö·û´óд
uppercase ÉèÖôóд×Ö·û
lowercase ÉèÖÃСд×Ö·û
vertical-align
sub ÉèÖÃÎÄ×ÖΪϱꡣ
super ÉèÖÃÎÄ×ÖΪÉϱꡣ
top Ôª¼þÍùÉ϶˿¿Æë¡£
middle ÉèÖÃÎÄ×ÖÊÇÔÚÖÐÏßλÖá£
bottom Ôª¼þÍù϶˿¿Æë¡£
Ïà¹ØÎĵµ£º
ÔÚÓÃDIV+CSSÅŰæÊ±£¬¾³£ÒªÊ¹×óÓÒÁ½±ßÀ¸Ä¿×Ô¶¯µÈ¸ß¡£ÕâÀï½éÉܸö¼òµ¥·½·¨~~
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<m ......
Ò»£®ÎļþÃüÃû¹æ·¶
È«¾ÖÑùʽ£ºglobal.css£»
¿ò¼Ü²¼¾Ö£ºlayout.css£»
×ÖÌåÑùʽ£ºfont.css£»
Á´½ÓÑùʽ£ºlink.css£»
´òÓ¡Ñùʽ£ºprint.css£»
¶þ£®³£ÓÃÀà/IDÃüÃû¹æ·¶
Ò³¡¡Ã¼£ºheader
ÄÚ¡¡ÈÝ£ºcontent
ÈÝ¡¡Æ÷£ºcontainer
Ò³¡¡½Å£ºfooter
°æ¡¡È¨£ºcopyright¡¡
µ¼¡¡º½£ºmenu
Ö÷µ¼º½£ºmainMenu
×Óµ¼º½£ºsubMenu
......
1Äê¤Û¤Éǰ¤Ë×÷³É¤·¤¿¡¢(X)HTML¤ÈCSS¤Î¥Þー¥¯¥¢¥Ã¥×¥¬¥¤¥É¥é¥¤¥ó¤Ç¤¹¡£¥¢¥ë¥Ð¥¤¥ÈÏȤΥ¬¥¤¥É¥é¥¤¥ó²ß¶¨¤Î際¤Ë¡¢¥Õ¥¡ー¥¹¥È¥É¥é¥Õ¥È¤È¤·¤Æ¤Ä¤¯¤Ã¤¿¤â¤Î¤Ç¤¹¡£1Äꥢ¥Ã¥×¥Çー¥È¤·¤Æ¤¤¤Ê¤¤¤Î¤ÇÇé報¤â¹Å¤¤¤Ç¤¹¤·¡¢Ö±¤·¤¿¤¤¤È¤³¤í¤â¤¤¤¯¤Ä¤«¤¢¤ë¤Î¤Ç¤¹¤¬¡¢¤»¤Ã¤«¤¯¤Ê¤Î¤Ç¤³¤³¤Ë³ö¤·¤Æ¤ß¤Þ¤·¤¿¡£
......
Ñ¡ÔñÆ÷ Óï·¨ ÃèÊö ʾÀý ±êǩѡÔñÆ÷ E{ .....} ÒÔÎĵµÔªËØ×÷ΪѡÔñ·û td{font-size:14px;
......} IDÑ¡ÔñÆ÷ #ID{...} ÒÔÎĵµÔªËصÄΩһ± ......
CSSÓÅÏȼ¶°üº¬Ëĸö¼¶±ð£¨ÎÄÄÚÑ¡ÔñÆ÷£¬IDÑ¡ÔñÆ÷£¬ClassÑ¡ÔñÆ÷£¬ÔªËØÑ¡ÔñÆ÷£©ÒÔ¼°¸÷¼¶±ð³öÏֵĴÎÊý¡£¸ù¾ÝÕâËĸö¼¶±ð³öÏֵĴÎÊý¼ÆËãµÃµ½CSSµÄÓÅÏȼ¶¡£
CSSÓÅÏȼ¶µÄ¼ÆËã¹æÔòÈçÏ£º
* Ò³ÃæÖÐÖ±½ÓÉèÖÃstyle,¼Ó1,0,0,0
* ÿ¸öIDÑ¡ÔñÆ÷(Èç #id),¼Ó0,1,0,0
* ÿ¸öClassÑ¡ÔñÆ÷(Èç .class)¡¢Ã¿¸öÊôÐÔÑ¡ÔñÆ÷(Èç [attribute=])¡¢Ã¿¸ö ......