Ò׽ؽØÍ¼Èí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö160KB

CSS±Ê¼ÇÖ®¼òд

2009-10-20 13:30:21
¼òдCSSÒ»Ö±±»ÎÒÍü¼Ç£¬Ã»°ì·¨¾ÍËÑÁ˵ã×ÊÁÏ£¬¼Ç¼ÈçÏ£º
font
¼òд£º
font:italic small-caps bold 12px/1.5em arial,verdana;
µÈЧÓÚ£º
font-style:italic;font-variant:small-caps;font-weight:bold;font-size:12px;line-height:1.5em;font-family:arial,verdana;
˳Ðò£ºfont-style | font-variant | font-weight | font-size | line-height | font-family
£¨×¢£º¼òдʱ£¬font-sizeºÍline-heightÖ»ÄÜͨ¹ýб¸Ü/×é³ÉÒ»¸öÖµ£¬²»ÄÜ·Ö¿ªÐ´¡££©
background
¼òд£º
background:#fff url(bg.gif) no-repeat fixed left top;
µÈЧÓÚ£º
background-color:#fff;background-image:url(bg.gif);background-repeat:no-repeat;background-attachment:fixed;background-position:left top;
˳Ðò£ºbackground-color | background-image | background-repeat | background-attachment | background-position
margin & padding
¼òд£º
margin:1px 0 2em -20px;
µÈЧÓÚ£º
margin-top:1px;margin-right:0;margin-bottom:2em;margin-left:-20px;
˳Ðò£ºmargin-top | margin-right | margin-bottom | margin-left
paddingµÄ¼òдºÍmarginÍêȫһÑù¡£
border
¼òд£º
border:1px solid #000;
µÈЧÓÚ£º
border-width:1px;border-style:solid;border-color:#000;
˳Ðò£ºborder-width | border-style | border-color
ÕâÈý¾äÒ²ÊǼòд£¬µÈÓÚÊǰÑËıߵÄÑùʽºÏ¶øÎªÒ»ÁË¡££¨¹ØÓÚËıߵÄÎÊÌ⣬ÏÂÎÄÓÐÏêϸ˵Ã÷£©
border-top / border-right / border-bottom / border-left
¼òд£º
border-top:1px solid #000;
µÈЧÓÚ£º
border-top-width:1px;border-top-style:solid;border-top-color:#000;
£¨ºÍborderÒ»Ñù£©
list-style
¼òд£º
list-style:square outside url(bullet.gif);
µÈЧÓÚ£º
list-style-type:square;list-style-position:outside;list-style-image:url(bullet.gif);
˳Ðò£ºlist-style-type | list-style-position | list-style-image
¹ØÓÚËıß
ÓкܶàÑùʽ¶¼Éæ¼°µ½ÁËËıߵÄÎÊÌ⣬ÕâÀïͳһ˵Ã÷¡£
Ëıߵļòдһ°ãÈçÏ£º
padding:1px 2px 3px 4px;
µÈЧÓÚ£º
padding-top:1px;padding-right:2px;padding-bottom:3px;padding-left:4px;
˳Ðò£ºtop | right | bottom | left
²»ÂÛÊDZ߿ò¿í¶È£¬»¹ÊDZ߿òÑÕÉ«¡¢±ß¾àµÈ£¬Ö»ÒªcssÑùÊ½Éæ¼°Ëıߣ¬Ë³Ðòͨͨ¶¼ÊÇ“ÉÏÓÒÏÂ×󔣨˳ʱÕë·½Ïò£©¡£
Èç¹ûËıߵÄֵʡÂÔÒ


Ïà¹ØÎĵµ£º

SpriteMe Ò³ÃæCSSͼƬ¹¤¾ß

SpriteMeÊÇGoogleµÄÒ»¸ö¿ªÔ´ÏîÄ¿£¬¿ÉÒÔÓÃÀ´·½±ãµØÕÒ³öÒ»¸öÒ³ÃæÖÐËùʹÓõÄͼƬ£¬È»ºó¿ÉÒÔ½«ËùÒÔͼƬºÏ²¢µ½Ò»¸ö“Sprite”ͼƬ£¬È»ºóÔÙͨ¹ý
CSS¿ØÖƵ÷ÓÃÄÄÒ»¸öÇøÓò£¬ÆäÌṩÁËÒ»¸öÍøÕ¾À´°²×°£¬ÑÝʾʹÓ÷½·¨£¬http://spriteme.org/  ¡£
°²×°·½·¨ºÜ¼òµ¥£¬°´ÕÕÉÏÃæÄǸöÒ³ÃæÉϵÄÌáʾ£¬½«Ò»¸öÁ´½ÓÍϵ½“ÊéÇ©¹ ......

CSS»¬¶¯ÃźáÏò²Ëµ¥À¸

Ч¹ûÈçÏ£º
              
ʵÏÖ·½·¨£ºÀûÓÃÒ»ÏÂÁ½ÕÅͼƬ£º                
ǰ̨´úÂ룺
 <div id="nagivation">
    &nb ......

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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TAO BAO TEST 2&l ......

DIV+CSSÖбêÇ©ul ol li dl dt ddÓ÷¨

ul ol li dl dt dd¶¼ÊÇDIV+CSS×öÍøÒ³³¤ÓõĶ«Î÷,Ï൱ÓÚÒ»¿ÃÊ÷µÄÊ÷¼¼,ÏÂÃæ¾ÍÁ˽âÒ»ÏÂÕâЩ¶«Î÷µÄÈ«ÌåÓ÷¨,±¾ÈËÓÃdd,dt,dlÓõúÜÉÙ,¶®µÃ½áºÏʹÓöÔ×ö¼Ü¹¹ÊǺÜÓкô¦µÄŶ!
DIV
CSSÍøÒ³²¼¾ÖÖг£ÓõÄÁбíÔªËØul ol li dl dt ddÊÍÒ壬¿é¼¶ÔªËØdiv¾¡Á¿ÉÙÓ㬺ÍtableÒ»Ñù£¬Ç¶Ì×Ô½ÉÙÔ½ºÃ
ol
ÓÐÐòÁÐ±í¡£
<ol>
<li> ......

CSSºÐ×Óģʽȫ½â

±¾½Ì³ÌΪwww.sw-web.cnÍøÒ³Éè¼ÆÑ§ÔºÍÆ¼öÎÄÕÂ
Èç¹ûÄãÏë³¢ÊÔһϲ»Óñí¸ñÀ´ÅŰæÍøÒ³£¬¶øÊÇÓÃCSSÀ´ÅŰæÄãµÄÍøÒ³£¬Ò²¾ÍÊdz£ÌýµÄÓÃDIVÀ´±àÅÅÄãµÄÍøÒ³½á¹¹£¬ÓÖ»òÕß˵ÄãÏëÑ§Ï°ÍøÒ³±ê×¼Éè¼Æ£¬ÔÙ»òÕß˵ÄãµÄÉÏ˾ҪÄã¸Ä±ä´«Í³µÄ±í¸ñÅŰ淽ʽ£¬Ìá¸ßÆóÒµ¾ºÕùÁ¦£¬ÄÇôÄãÒ»¶¨Òª½Ó´¥µ½µÄÒ»¸ö֪ʶµã¾ÍÊÇCSSµÄºÐ×Óģʽ£¬Õâ¾ÍÊÇDIVÅŰæµÄºËÐÄË ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ