¡¾Ê®Ì쾫ͨdiv+css²¼¾ÖϵÁн̡̳¿Ö®ËÄ£ºµ÷ÓÃÑùʽ±í
ÊÂʵÉÏ£¬ËùÓбíÏֵĵط½¶¼ÐèÒªÓÃCSSÀ´ÊµÏÖ¡£ÎÒÃÇÒÔǰ¶¼Ï°¹ßÓÃtableÀ´¶¨Î»ºÍ²¼¾Ö£¬ÏÖÔÚÒª¸ÄÓÃDIVÀ´¶¨Î»ºÍ²¼¾Ö¡£ÕâÊÇ˼ά·½Ê½µÄ±ä»¯£¬Ò»¿ªÊ¼ÓÐЩ²»Ï°¹ß¡£ºÇºÇ£¬Èκαä¸ï¶¼»áÓÐ×èÁ¦µÄ£¬ÎªÁËÏíÊܱê×¼´øÀ´µÄ"Òæ´¦"£¬·ÅÆúһЩÀϵĴ«Í³×ö·¨ÊÇÖµµÃµÄ¡£
¡¡¡¡Íⲿµ÷ÓÃÑùʽ±í
¡¡¡¡ÔÚÒÔǰ£¬ÎÒÃÇͨ³£²ÉÓÃ2ÖÖ·½·¨Ê¹ÓÃÑùʽ±í£º
¡¡¡¡Ò³ÃæÄÚǶ·¨£º¾ÍÊǽ«Ñùʽ±íÖ±½ÓдÔÚÒ³Ãæ´úÂëµÄheadÇø¡£ÀàËÆÕâÑù£º
¡¡¡¡<style type="text/css"> <!-- body { background : white ; color : black ; } --> </style>
¡¡
¡¡¡¡Íⲿµ÷Ó÷¨£º½«Ñùʽ±íдÔÚÒ»¸ö¶ÀÁ¢µÄ.cssÎļþÖУ¬È»ºóÔÚÒ³ÃæheadÇøÓÃÀàËÆÒÔÏ´úÂëµ÷Óá£
¡¡
¡¡¡¡<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" />
¡¡¡¡ÔÚ·ûºÏweb±ê×¼µÄÉè¼ÆÖУ¬ÎÒÃÇʹÓÃÍⲿµ÷Ó÷¨£¬ºÃ´¦²»ÑÔ¶øÓ÷£¬Äã¿ÉÒÔ²»ÐÞ¸ÄÒ³ÃæÖ»ÐÞ¸Ä.cssÎļþ¶ø¸Ä±äÒ³ÃæµÄÑùʽ¡£Èç¹ûËùÓÐÒ³Ãæ¶¼µ÷ÓÃͬһ¸öÑùʽ±íÎļþ£¬ÄÇô¸ÄÒ»¸öÑùʽ±íÎļþ£¬¿ÉÒԸıäËùÓÐÎļþµÄÑùʽ¡£
¡¡¡¡Ë«±í·¨µ÷ÓÃÑùʽ±í
¡¡¡¡²é¿´Ä³Ð©·ûºÏ±ê×¼Õ¾µãµÄÔ´úÂ룬Äã¿ÉÄÜ¿´µ½£¬ÔÚµ÷ÓÃÑùʽ±íµÄµØ·½ÓÐÈçÏÂ2¾ä£º
¡¡¡¡<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> <style type="text/css" media="all">@import url( css/style01.css );</style>
¡¡¡¡ÎªÊ²Ã´ÒªÐ´Á½´ÎÄØ£¿
¡¡¡¡Êµ¼ÊÉÏÒ»°ãÇé¿öÏÂÓÃÍâÁª·¨µ÷ÓÃ(¾ÍÊǵÚÒ»¾ä)¾Í×ã¹»ÁË¡£ÎÒÕâÀïʹÓÃË«±íµ÷ÓÃÖ»ÊÇÒ»ÖÖʾÀý¡£ÆäÖеÄ"@import"ÃüÁîÓÃÓÚÊäÈëÑùʽ±í¡£¶ø"@import"ÃüÁîÔÚnetscape 4.0°æ±¾ä¯ÀÀÆ÷ÊÇÎÞЧµÄ¡£Ò²¾ÍÊÇ˵£¬µ±ÄãÏ£ÍûijЩЧ¹ûÔÚnetscape 4.0ä¯ÀÀÆ÷ÖÐÒþ²Ø£¬ÔÚ4.0ÒÔÉÏ»òÆäËüä¯ÀÀÆ÷ÖÐÓÖÏÔʾµÄʱºò£¬Äã¿ÉÒÔ²ÉÓÃ"@import"ÃüÁî·½·¨µ÷ÓÃÑùʽ±í¡£
Ïà¹ØÎĵµ£º
¸Õ¿ªÊ¼Ñ§css£¬¿ªÊ¼Óöµ½filter²»¶®Ê²Ã´Òâ˼ºóÀ´µ½ÍøÉϲéÁË£¬¾õµÃ½âÊ͵ĺÜÈ«Ãæ£¬¾Í°ÑËü¿ÙÏÂÀ´£¬ÒÔ±ã×Ô¼º¾³£À´¿´¿´¡£
CSSÂ˾µµÄʹÓ÷½·¨£ºfilter:filtername(parameters)¡¡¼´ filter:Â˾µÃû³Æ£¨²ÎÊý£©
alpha£ºÉèÖÃ͸Ã÷²ã´Î
blur£º´´½¨¸ßËÙ¶ÈÒÆ¶¯Ð§¹û£¬¼´Ä£ºýЧ¹û
chroma£ºÖÆ×÷רÓÃÑÕɫ͸Ã÷
DropShadow£º´´½¨¶ÔÏóµÄ¹Ì¶¨Ó° ......
¡¡´ó¶àÊýÈ˺ÜÈÝÒ×½«CSSÊôÐÔdisplayºÍvisibility»ìÏý£¬ËüÃÇ¿´ËÆÃ»ÓÐʲô²»Í¬£¬ÆäʵËüÃǵIJî±ðÈ´ÊǺܴóµÄ¡£
¡¡¡¡visibilityÊôÐÔÓÃÀ´È·¶¨ÔªËØÊÇÏÔʾ»¹ÊÇÒþ²Ø£¬ÕâÓÃvisibility="visible|hidden"À´±íʾ£¬visible±íʾÏÔʾ£¬hidden±íʾÒþ²Ø¡£µ±visibility±»ÉèÖÃΪ"hidden"µÄʱºò£¬ÔªËØËäÈ»±»Òþ²ØÁË£¬µ«ËüÈÔȻռ¾ÝËüÔÀ´ËùÔÚµÄλÖà ......
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; ......
Á½Áв¼¾Ö
1¡¢×óÁй̶¨£¬ÓÒÁÐ×ÔÊÊÓ¦
#left{ width:190px; float:left; }
#right{ margin-left:205px; }
2¡¢ÓÒÁй̶¨£¬×óÁÐ×ÔÊÊÓ¦
#left{ float:left; width:100%; }
#right{ float:left; margin-left:-100px; width:100px; }
ÈýÁв¼¾Ö
×óÓ ......
.box128{
width:128px;
height:128px;
text-align: center;
vertical-align:middle;
display:table-cell !important;
display:block;
border:1px solid #DDD;
  ......