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

10¸ö DIV+CSS ÐèҪעÒâµÄÎÊÌâ

1. ¼ì²éHTMLÔªËØÊÇ·ñÓÐƴд´íÎó¡¢ÊÇ·ñÍü¼Ç½áÊø±ê¼Ç
¼´Ê¹ÊÇÀÏÊÖÒ²¾­³£»áŪ´ídivµÄǶÌ×¹Øϵ¡£¿ÉÒÔÓÃdreamweaverµÄÑéÖ¤¹¦Äܼì²éÒ»ÏÂÓÐÎÞ´íÎó¡£
2. ¼ì²éCSSÊÇ·ñÕýÈ·
¼ì²éÒ»ÏÂÓÐÎÞƴд´íÎó¡¢ÊÇ·ñÍü¼Ç½áβµÄ } µÈ¡£¿ÉÒÔÀûÓÃCleanCSSÀ´¼ì²é CSSµÄƴд´íÎó¡£CleanCSS±¾ÊÇΪCSS¼õ·ÊµÄ¹¤¾ß£¬µ«Ò²Äܼì²é³öƴд´íÎó¡£
3. È·¶¨´íÎó·¢ÉúµÄλÖÃ
¼ÙÈç´íÎóÓ°ÏìÁËÕûÌå²¼¾Ö£¬Ôò¿ÉÒÔÖð¸öɾ³ýdiv¿é£¬Ö±µ½É¾³ýij¸ödiv¿éºóÏÔʾ»Ö¸´Õý³££¬¼´¿ÉÈ·¶¨´íÎó·¢ÉúµÄλÖá£
4. ÀûÓÃborderÊôÐÔÈ·¶¨³ö´íÔªËصIJ¼¾ÖÌØÐÔ
ʹÓÃfloatÊôÐÔ²¼¾ÖÒ»²»Ð¡Ðľͻá³ö´í¡£ÕâʱΪԪËØÌí¼ÓborderÊôÐÔÈ·¶¨ÔªËر߽磬´íÎóÔ­Òò¼´Ë®Âäʯ³ö¡£
5. floatÔªËصĸ¸ÔªËز»ÄÜÖ¸¶¨clearÊôÐÔ
MacIEϼÙÈç¶ÔfloatµÄÔªËصĸ¸ÔªËØʹÓÃclearÊôÐÔ£¬ËÄÖܵÄfloatÔªËز¼¾Ö¾Í»á»ìÂÒ¡£ÕâÊÇMacIEµÄÎÅÃûµÄbug£¬ÌÈÈô²»ÖªµÀ¾Í»á×ßÍä·¡£
6. floatÔªËØÎñ±ØÖ¸¶¨widthÊôÐÔ
ºÜ¶àä¯ÀÀÆ÷ÔÚÏÔʾδָ¶¨widthµÄfloatÔªËØʱ»áÓÐbug¡£ËùÒÔ²»¹ÜfloatÔªËصÄÄÚÈÝÈçºÎ£¬Ò»¶¨ÒªÎªÆäÖ¸¶¨widthÊôÐÔ¡£
ÁíÍâÖ¸¶¨ÔªËØʱ¾¡Á¿Ê¹ÓÃem¶ø²»ÊÇpx×öµ¥Î»¡£
7. floatÔªËز»ÄÜÖ¸¶¨marginºÍpaddingµÈÊôÐÔ
IEÔÚÏÔʾָ¶¨ÁËmarginºÍpaddingµÄfloatÔªËØʱÓÐbug¡£Òò´Ë²»Òª¶ÔfloatÔªËØÖ¸¶¨marginºÍpaddingÊôÐÔ£¨¿ÉÒÔÔÚfloatÔªËØÄÚ²¿Ç¶Ì×Ò»¸ödivÀ´ÉèÖÃmarginºÍpadding£©¡£Ò²¿ÉÒÔʹÓÃhack·½·¨ÎªIEÖ¸¶¨·Ç·²µÄÖµ¡£
8. floatÔªËصĿí¶ÈÖ®ºÍҪСÓÚ100%
¼ÙÈçfloatÔªËصĿí¶ÈÖ®ºÍÕýºÃÊÇ100%£¬Ä³Ð©¹ÅÀϵÄä¯ÀÀÆ÷½«²»ÄÜÕý³£ÏÔʾ¡£Òò´ËÇë±£Ö¤¿í¶ÈÖ®ºÍСÓÚ99%¡£
9. ÊÇ·ñÖØÉèÁËĬÈϵÄÑùʽ£¿
ijЩÊôÐÔÈçmargin¡¢paddingµÈ£¬²»Í¬ä¯ÀÀÆ÷»áÓв»Í¬µÄ½âÊÍ¡£Òò´Ë×îºÃÔÚ¿ª·¢Ç°Ê×ÏȽ«È«ÌåµÄmargin¡¢paddingÉèÖÃΪ0¡¢ÁбíÑùʽÉèÖÃΪnoneµÈ¡£
10. ÊÇ·ñÍü¼ÇÁËдDTD£¿
¼ÙÈçÎÞÂÛÔõÑùµ÷Õû²»Í¬ä¯ÀÀÆ÷ÏÔʾ½á¹û»¹ÊDz»Ò»Ñù£¬ÄÇô¿ÉÒÔ¼ì²éÒ»ÏÂÒ³Ã濪ͷÊDz»ÊÇÍüÁËдÏÂÃæÕâÐÐDTD£º
£¼!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\"£¾


Ïà¹ØÎĵµ£º

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-var ......

DIV+CSSÖÆ×÷¹ö¶¯Ìõ


<style> 
* {  
 margin:0;  
 padding:0;  
}  
body {  
 font-size:12px;  
 font-family:Verdana, Arial, Helvetica, sans-serif;  
 background:#FFFFFF;  
 margin: ......

¸ù±¾²»´æÔÚ DIV + CSS ²¼¾ÖÕâ»ØÊÂ

 ×ª:дµÄ²»´í,¶ÔÓÚÍøÒ³¿ª·¢ÓÐÖ¸µ¼ÒâÒå
ÔÚ¡¶ÓûÁ· CSS £¬±ØÏȹ¬ IE¡·ºÍ¡¶ÄãÓÐ <table /> Ç¿ÆÈÖ¢Â𣿡·ÕâÁ½ÆªÎÄÕÂÖУ¬¿´µ½Óв»ÉÙÆÀÂÛÓõ½div+CSS²¼¾ÖÕâ¸ö˵·¨£¬ÓÃÀ´ºÍtable²¼¾Ö±È½Ï¡£Êµ¼ÊÉÏdiv²»ÊÇÓÃÀ´²¼¾ÖµÄ£¬divÖ»ÊÇÓÃÀ´±íʾһ¸öÆäËüÔªËض¼ÎÞ·¨×¼È·±í´ïÓïÒâµÄÒ»¸ö¿éÇø£¬Ö»ÓÐCSSÊÇÓÃÓÚ²¼¾ÖµÄ£¬ËùÒÔ¸ù±¾¾Í²»´æÔÚdi ......

ÌÔ±¦css×¢½â

ÎÒÃÇ°ÑËü·ÖΪÈçÏÂͼËùʾ¿é
¾ßÌåµÄHTML,DIV+CSSÅÅ°æÑùʽΪ
ÎÒÃÇÒ»ÐÐÒ»ÐзÖÎö,
1.È«²¿µÄ´úÂë¾ùÔÚÒ»¸öDIVÈÝÆ÷(ÎÒÔÝʱÕâÑù³Æºô) HeadÀïÃæ,ÎÒÃÇÀ´¿´¿´HeadµÄд·¨
#Head{
    text-align:center;
}
ΪʲôHeadÇ°ÃæÓÐÒ»¸ö"#"ºÅÄØ?
¶øÓеÄÈ´ÊÇÔÚÇ°Ãæ¼ÓÒ»¸ö"£®"±ÈÈç "£®Head",ÓÐʱºòдcssµÄʱºò¸É´àʲôҲ²»¼ ......

IE6 Ï£ºhover ÖÐbug½â¾öÁË£¨´¿CSS£©

Õâ¸öbug£¬Ö÷ÒªÊÇÒ»¸ö¶þ¼¶²Ëµ¥£¬ÔÚie7ÖÐhoverʱÕý³£ÏÔʾ³öÀ´£¬ÔÚie6ÏÂûÓÐЧ¹û¡£ÔÚÍøÉÏÕÒÁ˺ܶà×ÊÁÏ£¬ÅªÁ˺ü¸Ì죬×îÖÕÊDzÎÕÕ±ðÈ˵ĴúÂ룬ÓõĴ¿css¾­¹ý×Ô¼ºµÄÕûÀí£¬¾Í°ÑËü¸øŪÏÂÀ´ÁË¡£Ï£ÍûÒÔºó×Ô¼º¶àÀ´¿´¿´¡£
ÈçÏ£º
 £­£­£­£­£­£­£­£­£­£­£­£­£­£­£­£­£­£­£­
css´úÂ룺
.allMenu
{
    width: 8 ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØͼ | ¸ÓICP±¸09004571ºÅ