CSS ÎÊÌ⣬¿ØÖÆÁ½¸öÁ¬½ÓÏÔʾ²»Í¬µÄͼƬ
Ò³ÃæÉÏÓÐÁ½¸öÁ¬½Ó£¬
ÎÒÏ£ÍûµÃµ½ÕâÑùµÄЧ¹û£¬¿ÉÒÔʵÏÖÂð
¿ªÊ¼µÄʱºò Á´½ÓAÏÔʾA.gif,Á´½ÓBÏÔʾB.gifΪ±³¾°É«£¬
µ±Êó±êÍ£ÁôÔÚAÁ´½ÓÉÏÃæµÄʱºòÏÔʾAHover.gif,Êó±êÍ£ÁôÔÚBÁ´½ÓÉÏÏÔʾBHover.gifͼƬΪ±³¾°É«
CSSºÜÈõµÄ£¬Èç¹ûÖ»ÓÐÒ»¸öÁ¬½ÓÎÒ»á¿ØÖÆ£¬µ«ÊǶà¸öÁ´½ÓÎҾͲ»ÖªµÀÁË£¬»áµÄ°ï°ïæ
лл
CSS code:
.A a:link,a:active,a:visited{text-decoration:none; background:url(A.gif);}
.B a:link,a:active,a:visited{text-decoration:none; background:url(A.gif);}
/*Á´½ÓÈôÓÐID¿ÉÖ±½Ó#id,ÎÞÔòÓø¸²ã,ÏÖÔÚ¼ÙÉèÄãµÄÐÎʽÊÇ<div class="A"><a></a>*/
.A a:hover{background:url(AHover.gif);}
.B a:hover{background:url(BHover.gif);}
/*ÓÐЩä¯ÀÀÆ÷ÓÐÏà¹Øhack,¿ÉgooleÏÂ*/
css×îÖØÒªÊÇÀí½âÒ³Ãæ×éÖ¯½á¹¹
лл»Ø¸´
ÎÒ¶¨ÒåÁË ÈçϵÄ
#A a:link,a:active,a:visited{text-decoration:none; background:url(A.gif);}
#A a:hover{background:url(AHover.gif);}
µ«ÊÇÎÒÖ»¸ø
<a id="A" href="#">A </a> µ«ÊDz»ÖªµÀÎªÊ²Ã´Ò³ÃæÉÏËùÓеÄÁ´½Ó±³¾°Í¼Æ¬¶¼»»ÁË£¬ÎÒ°ÑÊó±ê·Åµ½AÉÏ£¬Í¼Æ¬²»¸Ä±ä£¬
ÎÒ¶¨ÒåÕâÑùµÄ
#A {text-decoration:none; background:url(A.gif);}
#A a:hover{background:url(AHover.gif);}
Ö»ÓÐAÁ´½ÓͼƬÊÇA.gif,µ«ÊÇÊó±êÒÆ¶¯µ½AÉÏÃæÈÔȻûÓб仯
up
Ñùʽ»¹ÊÇÓÃÔÀ´µÄ
<div id="A"&
Ïà¹ØÎÊ´ð£º
ÎÒÓпÕûÓÐÊÂ×öÑо¿Ò»ÏÂCSS+DIV,ÏÖ×öÒ»Ìõµ¼º½Ìõ£¬Óöµ½Ò»¸öÎÊÌ⣬Ëü´ó¼Ò°ïæ½â¾öһϣº
ÒÔÏ´úÂë¿ÉÒÔʵÏÖ¾ÓÖУ¬µ«ÓÐÒ»¸öÎÊÌâ¾ÍÊÇ£¬Èç¹ûÎÒ¼Ó¶àÒ»¸öÀ¸Ä¿±ÈÈç¼Ó¶àÒ»¸öHTML code:
<li><a href="" ......
ÎÒÏÖÔÚÔÚÑ§Ï°ÍøÕ¾¿ª·¢£¬Ñ§Ï°µÄ¹ý³ÌÖз¢ÏÖCSSÊÇÓÃÀ´ÉèÖÃÑùʽµÄ£¬¶øDOMÒ²¿ÉÒÔÓÃÀ´ÉèÖÃÑùʽ£¬js¿âÒ²¿ÉÒÔ¡£
ÕâЩ¾¿¾¹ÔÚʲôʱºòÓÃʲô?
ÇëÖ¸µã£¡Ð»Ð»£¡
²»ÓÃjs+dom²Ù×÷css,LZд¸öÓÃdom²Ù×÷cssµÄÀ´¿´¿´
DOMÖ»ÊÇÒ» ......
ÔÚʹÓÃCSSÖеÄpadding-leftʱÓöµ½Ò»¸öÎÊÌâ¡£¾ÍÊDZ¾À´ÒѾÉèÖúõĿí¶È£¬padding-leftÒ»ÉèÖà ¶àÉÙºÃÏñ¾Í°ÑÕâ¸ö¼Ó¿íÁ˶àÉÙ¡£ºóÃæµÄDIV¾Í±äλÖÃÁË¡£ÓÐû½â¾ö°ì·¨Ñ½
ÇëÎÊÄãIE¼¸°¡£¿=£¬= ²»»áÓÐÕâÖÖÇé¿öÒ®
Èç¹ûÊÇIE6£¬Ä ......
ÕâÌõ´úÂë £ºbackground:#fff url(images/feature.jpg) no-repeat right -60px;
background:#fff url(images/feature.jpg) no-repeat ——Õâ¾äÄÜ¿´¶®
right -60px —— ÕâʲôÒâ˼ ¡· ......
<div style ="width:538px; height:150px; border:solid 1px gray; padding:10px;">
<div style =" width:230px; height:150px; float ......