Ä¿Ç°±È½ÏÈ«µÄCSSÖØÉè(reset)·½·¨×ܽá
¡¡¡¡ÔÚµ±½ñÍøÒ³Éè¼Æ/¿ª·¢Êµ¼ùÖУ¬Ê¹ÓÃCSSÀ´ÎªÓïÒ廯µÄ(X)HTML±ê¼ÇÌí¼ÓÑùʽ·ç¸ñÊÇÖØÒªµÄ¹Ø¼ü¡£ÔÚÉè¼ÆʦÃǵÄÃÎÏëÖж¼´æÔÚ×ÅÕâÑùµÄÒ»¸öÍêÃÀ
ÊÀ½ç:ËùÓеÄä¯ÀÀÆ÷¶¼Äܹ»Àí½âºÍÊÊÓöàÓÐCSS¹æÔò£¬²¢ÇÒ³ÊÏÖÏàͬµÄÊÓ¾õЧ¹û(ûÓмæÈÝÐÔÎÊÌâ)¡£µ«ÊÇ£¬ÎÒÃDz¢Ã»ÓÐÉú»îÔÚÕâ¸öÍêÃÀµÄÊÀ½ç£¬ÏÖʵÖз¢ÉúµÄʧ
ÇÔÈ´×ÜÊÇÇ¡Ç¡Ïà·´£¬ºÜ¶àCSSÑùʽÔÚ²»Í¬µÄä¯ÀÀÆ÷ÖÐÓÐ×Ų»Í¬µÄ½âÊͺͳÊÏÖ¡£
¡¡¡¡µ±½ñÁ÷ÐеÄä¯ÀÀÆ÷(Èç:Firefox¡¢Opera¡¢Internet
Explorer¡¢Chrome¡¢SafariµÈµÈ)ÖУ¬ÓÐһЩ¶¼ÊÇÒÔ×Ô¼ºµÄ·½Ê½È¥Àí½âCSS¹æ·¶£¬Õâ¾Í»áµ¼ÖÂÓеÄä¯ÀÀÆ÷¶ÔCSSµÄ½âÊÍÓëÉè¼ÆʦµÄCSS
¶¨Òå³õÖÔÏà³åÍ»£¬Ê¹µÃÍøÒ³µÄÑù×ÓÔÚijЩä¯ÀÀÆ÷ÏÂÄÜÕýÈ·°´ÕÕÉè¼ÆʦµÄÏë·¨ÏÔʾ£¬µ«ÓÐЩä¯ÀÀÆ÷È´²¢Ã»Óа´ÕÕÉè¼ÆʦÏëÒªµÄÑù×ÓÏÔʾ³öÀ´£¬Õâ¾Íµ¼ÖÂä¯ÀÀÆ÷µÄ¼æÈÝÐÔ
ÎÊÌâ¡£¸üÔãµÄÊÇ£¬ÓеÄä¯ÀÀÆ÷ÍêÈ«ÎÞÊÓCSSµÄһЩÉùÃ÷ºÍÊôÐÔ¡£
¡¡¡¡ÕýÒòΪÉÏÊö³åÍ»ºÍÎÊÌâÒÀÈ»´æÔÚÓÚÕâ¸ö”²»ÍêÃÀµÄÊÀ½ç”£¬ËùÒÔһЩÉè¼ÆʦÏëµ½ÁËÒ»ÖÖ±ÜÃâä¯ÀÀÆ÷¼æÈÝÐÔÎÊÌâµÄ·½·¨£¬ÄǾÍÊÇCSS Reset£¬Ê²Ã´ÊÇCSS Reset£¿
ÎÒÃÇ¿ÉÒÔ°ÑËü½Ð×öCSSÖØÉ裬ҲÓÐÈ˽Ð×öCSS¸´Î»¡¢Ä¬ÈÏCSS¡¢CSSÖØÖõȡ£CSSÖØÉè¾ÍÊÇÓÉÓÚ¸÷ÖÖä¯ÀÀÆ÷½âÊÍCSSÑùʽµÄ³õʼֵÓÐËù²»Í¬£¬µ¼ÖÂÉè¼ÆʦÔÚûÓж¨Òåij¸öCSSÊôÐÔʱ£¬²»Í¬µÄä¯ÀÀÆ÷»á°´ÕÕ×Ô¼ºµÄĬÈÏÖµÀ´ÎªÃ»Óж¨ÒåµÄÑùʽ¸³Öµ£¬ËùÒÔÎÒÃÇÒªÏȶ¨ÒåºÃһЩCSSÑùʽ£¬À´ÈÃËùÓÐä¯ÀÀÆ÷¶¼°´ÕÕͬÑùµÄ¹æÔò½âÊÍ
CSS
£¬ÕâÑù¾ÍÄܱÜÃâ·¢ÉúÕâÖÖÎÊÌâ¡£
¡¡¡¡±¾ÎÄ×ܽáÊÕ¼¯ÁË15Ì×CSSÖØÉèʵÀý
£¬Äú¿ÉÒÔÔÚÇ°¶Ë¿ª·¢¹¤×÷ÖнøÐвο¼ºÍʹÓã¬ÓÐЩÊǺܼò»¯µÄCSS Reset£¬ÓÐЩÔòÊǷdz£¸´Ôӷdz£È«ÃæµÄCSS Reset£¬ÖÁÓÚʹÓÃÄÄÌ×£¬È«¿´ÄúµÄ°®ºÃ»òÐèÒª¡£
Ò».×î¼ò»¯µÄCSS Reset(ÖØÉè) :
* {
padding: 0;
margin: 0;
}
¡¡¡¡ÕâÊÇ×îÆÕ±é×î¼òµ¥µÄCSSÖØÉ裬½«ËùÓÐÔªËصÄpaddingºÍmarginÖµ¶¼ÉèΪ0£¬¿ÉÒÔ±ÜÃâһЩä¯ÀÀÆ÷ÔÚÀí½âÕâÁ½¸öÊôÐÔĬÈÏÖµÉϵĔ·ÖÆ甡£
* {
padding: 0;
margin: 0;
border: 0;
}
¡¡¡¡ÕâÊÇÔÚÉÏÒ»¸öÖØÉèµÄ»ù´¡ÉÏÌí¼ÓÁ˶ÔborderÊôÐÔµÄÖØÉ裬³õʼֵΪ0µÄÈ·ÄܱÜÃâһЩÎÊÌâ¡£
* {
outline: 0;
padding: 0;
margin: 0;
border: 0;
}
¡¡¡¡ÔÚÇ°Á½¸öµÄ»ù´¡
Ïà¹ØÎĵµ£º
1.³¬Á´½Ó·ÃÎʹýºóhoverÑùʽ¾Í²»³öÏÖµÄÎÊÌâ?
±»µã»÷·ÃÎʹýµÄ³¬Á´½ÓÑùʽ²»ÔÚ¾ßÓÐhoverºÍactiveÁË,½â¾ö·½·¨ÊǸıäCSSÊôÐÔµÄÅÅÁÐ˳Ðò: L-V-H-A
2.IE6µÄË«±¶±ß¾àBUG
ÀýÈç:
<style type="text/css">
body {margin:0}
div { float:left; margin-left:10px; width:200px; ......
ÔÚ ASP .NET µÄ AJAX ¿Ø¼þÖÐ TabContainer µÄ CSS ÑùʽµÄ±àд¾ßÓÐÒ»¶¨µÄ¸ñʽ¹æ·¶¼°ÃüÃû¹æÔò£¬ÈçÏÂͼ£º
¾ßÌåµÄ CSS ÑùʽµÄ±àдΪ£º
.ajax_tab_menu .ajax__tab_header /*ÕûÌå°´Å¥µ×Ñùʽ*/
{
font-family:ËÎÌå;
height:29px;
font-size:12px;
background:#181c1f repeat-x bottom;
}
.ajax_tab_menu .ajax__tab ......
.box128{
width:128px;
height:128px;
text-align: center;
vertical-align:middle;
display:table-cell !important;
display:block;
border:1px solid #DDD;
  ......
<html>
<head>
<title>CSSαÀà pseudo-class</title>
<style type="text/css">
a:link {color: #FF0000} /* δ±»·ÃÎʵÄÁ´½Ó ºìÉ« */
a:visited {color: #00FF00} /* Òѱ»·ÃÎʹýµÄÁ´½Ó ÂÌÉ« */
a:hover {color: #FFCC00} /* Êó±êÐü¸¡ÔÚÉϵÄÁ ......
µÚÈý²½ÊǶ¨ÒåÄãµÄÓïÑÔ±àÂ룬ÀàËÆÕâÑù£º
¡¡¡¡<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
ΪÁ˱»ä¯ÀÀÆ÷ÕýÈ·½âÊͺÍͨ¹ýW3C´úÂëУÑ飬ËùÓеÄXHTMLÎĵµ¶¼±ØÐëÉùÃ÷ËüÃÇËùʹÓõıàÂëÓïÑÔ£¬ÎÒÃÇÒ»°ãʹÓÃgb2312(¼òÌåÖÐÎÄ)£¬ÖÆ×÷¶à¹úÓïÑÔÒ³ÃæÒ²ÓпÉÄÜÓÃUnicode¡¢ISO-8859-1µÈ£¬¸ù¾ÝÄãµÄÐ ......