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

DIV+CSS½¨Õ¾¶Ôä¯ÀÀÆ÷µÄ¼æÈÝÐÔÎÊÌâºÍ×¢ÒâÊÂÏî

ʹÓÃDIV+CSS¹¹¼ÜºÃ´¦²»ÉÙ£¬µ«Ò²È·Êµ´æÔÚһЩÎÊÌ⣬ÏÖÔÚÈÃÍøÒ³Éè¼ÆÊ¦×îÍ·ÌÛµÄÊÂιýÓÚDIV+CSS¶Ôä¯ÀÀÆ÷µÄ¼æÈÝÐÔÁË£¬¿ÉÄÜÄãÓùßÁËIE6£¬×ö³öÀ´µÄ¶«Î÷û¸Ð¾õµ½Óжà´óÒì³££¬µ«ÊǰÑͬÑùµÄ¶«Î÷·Åµ½IE7ÀïÈ¥¿´µÄ»°£¬¾Í»á·¢ÏֺܶàÎÊÌ⣬Èç¹û·Åµ½»ðºüä¯ÀÀÆ÷ÀïÈ¥¿´£¬½á¹û¸ü²»¾¡ÈËÒâ¡£
    Ò»¸öÒ³Ãæ´ÓÖÆ×÷µÄ¿ªÊ¼¾Í¾ö¶¨ÁËËûҪʹÓõÄä¯ÀÀÆ÷½âÎöcssģʽ£¬ä¯ÀÀÆ÷ģʽµÄ²»Í¬£¬¾ÍÔì³ÉÁ˸÷¸öä¯ÀÀÆ÷¶ÔÒ³ÃæÏÔʾµÄ²îÒì¡£ä¯ÀÀÆ÷½âÎöcssÓÐÁ½ÖÖģʽ,quirks modeºÍstrict mode,ĿǰÕýÔÚʹÓõÄä¯ÀÀÆ÷ÕâÁ½ÖÖģʽ¶¼Ö§³Ö£¬ÔÚdoctypeÉùÃ÷ÖÐ, ûÓÐʹÓÃDTDÉùÃ÷»òÕßʹÓÃHTML4ÒÔÏ£¨²»°üÀ¨HTML4£©µÄDTDÉùÃ÷ʱ£¬»ù±¾ËùÓеÄä¯ÀÀÆ÷¶¼ÊÇʹÓÃquirks mode³ÊÏÖ£¬ÆäËûµÄÔòʹÓÃstrict mode½âÎö¡£
    ÕâÁ½ÖÖģʽ×î´óµÄ²»Í¬¾ÍÊÇÌáÏÖÔÚ¶ÔºÐģʽµÄ½âÊÍÉÏ¡£Ê²Ã´ÊǺÐģʽ£¿ÕâÊÇÕë¶Ô¿é¼¶ÔªËØËµµÄ£¬ÕâÀï¼òµ¥ËµÒ»Ï£¬Ëµ°×Á˾ÍÊÇ°Ñ¿é¼¶ÔªËØÏëÏñ³ÉÒ»¸ö×°¶«Î÷µÄºÐ×Ó£¬¶ømargin,padding,border,widthÕâЩcssÊôÐÔ¹¹³ÉÁ˺Ðģʽ¡£¶øÇø±ð¾ÍÊDzúÉúÔÚwidthÊôÐÔÉÏ¡£
    ÔÚstrict modeÖУº
    widthÊÇÄÚÈÝ¿í¶È £¬Ò²¾ÍÊÇ˵,ÔªËØÕæÕýµÄ¿í¶È = margin-left + border-left-width + padding-left + width + padding-right + border-right-width + margin-right;
    ÔÚquirks modeÖУº
    widthÔòÊÇÔªËØµÄʵ¼Ê¿í¶È £¬ÄÚÈÝ¿í¶È = width - (margin-left + margin-right + padding-left + padding-right + border-left-width + border-right-width)
    ÆäËûҪעÒâµÄÊÂÏ
    ·ÄÚÁªÔªËØ £¬ÀýÈç<a>¡¢<span>µÈ£¬¶¨ÒåÉÏϱ߽粻»áÓ°Ïìµ½Ðиß(line-height)£¬ÄÚÁªÔªËؾàÀëÉÏÒ»ÐÐÔªËØµÄ¾àÀëÓÉÐи߾ö¶¨£¬¶ø²»ÊÇÌî³ä»ò±ß½ç¡£ ×¢2. ÄÚÁªÔªËØ(display: inline) ÄÚÁªÔªËز»ÐèÒªÔÚÐÂÐÐÄÚÏÔʾ£¬¶øÇÒÒ²²»Ç¿ÆÈÆäºóµÄÔªËØ»»ÐУ¬Èça¡¢em¡¢spanµÈ¶¼ÎªÄÚÁªÔªËØ¡£ÄÚÁªÔªËØ¿ÉÒÔΪÈÎºÎÆäËûÔªËØµÄ×ÓÔªËØ¡£
    ·¸¡¶¯ÔªËØ(ÎÞÂÛ×ó»òÕßÓÒ¸¡¶¯)±ß½ç²»Ñ¹Ëõ £¬ÇÒÈô¸¡¶¯ÔªËز»ÉùÃ÷¿í¶È£¬ÔòÆä¿í¶ÈÇ÷ÏòÓÚ0£¬¼´Ñ¹Ëõµ½ÆäÄÚÈÝÄܳÐÊܵÄ×îС¿í¶È¡£
    ·Èç¹ûºÐÖÐûÓÐÄÚÈÝ£¬Ôò¼´Ê¹¶¨ÒåÁË¿í¶ÈºÍ¸ß¶È¶¼Îª100%£¬Êµ¼ÊÉÏÖ»Õ¼0% £¬Òò´Ë²»»á±»ÏÔʾ£¬´ËµãÔÚ²ÉÈ¡²ã²¼¾ÖµÄʱºòÐèÌØ±ð×¢Òâ¡£
    ·±ß½çÖµ¿ÉΪ¸º£¬ÆäÏÔʾЧ¹û¸÷ä¯ÀÀÆ÷¿ÉÄܲ»Ïàͬ ¡


Ïà¹ØÎĵµ£º

div+cssÖ®×óÓÒÀ¸Ä¿×Ô¶¯µÈ¸ß

ÔÚÓÃDIV+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>
<m ......

CSSÖÐvisibilityÓëdisplayµÄÇø±ð

CSSÖÐvisibilityÓëdisplayµÄÇø±ð
CSSÖеÄÊôÐÔvisibilityÓëdisplay¶¼¿ÉʵÏÖÏÔʾ¡¢Òþ²ØÔªËصÄЧ¹û£¬µ«ËûÃÇÖ®¼äÒ²ÓкܴóµÄÇø±ð¡£
visibility¹æ¶¨ÔªËصÄÄÚÈÝÊÇ·ñÏÔʾ£»¶ødisplay¹æ¶¨ÔªËر¾ÉíµÄÏÖʵ·½Ê½£¬¿ÉÒÔ¾ö¶¨ÔªËر¾ÉíÊÇ·ñ¿É¼û¡£
visibilityµÄvisible±íʾÏÔʾ£¬hidden±íʾÒþ²Ø¡£µ±visibility±»ÉèÖÃΪ"hidden"ʱ£¬ËäÈ»ÔªËØ ......

(X)HTML+CSS¤Î¥Þー¥¯¥¢¥Ã¥×¥¬¥¤¥É¥é¥¤¥ó

1Äê¤Û¤Éǰ¤Ë×÷³É¤·¤¿¡¢(X)HTML¤ÈCSS¤Î¥Þー¥¯¥¢¥Ã¥×¥¬¥¤¥É¥é¥¤¥ó¤Ç¤¹¡£¥¢¥ë¥Ð¥¤¥ÈÏȤΥ¬¥¤¥É¥é¥¤¥ó²ß¶¨¤Î際¤Ë¡¢¥Õ¥¡ー¥¹¥È¥É¥é¥Õ¥È¤È¤·¤Æ¤Ä¤¯¤Ã¤¿¤â¤Î¤Ç¤¹¡£1Äꥢ¥Ã¥×¥Çー¥È¤·¤Æ¤¤¤Ê¤¤¤Î¤ÇÇé報¤â¹Å¤¤¤Ç¤¹¤·¡¢Ö±¤·¤¿¤¤¤È¤³¤í¤â¤¤¤¯¤Ä¤«¤¢¤ë¤Î¤Ç¤¹¤¬¡¢¤»¤Ã¤«¤¯¤Ê¤Î¤Ç¤³¤³¤Ë³ö¤·¤Æ¤ß¤Þ¤·¤¿¡£
......

CSS hack:Çø·ÖIE6£¬IE7£¬firefox

ת×Ô£ºhttp://www.div-css.com/html/XHTML-CSS/hack/1136667.html
Çø±ð²»Í¬ä¯ÀÀÆ÷£¬CSS hackд·¨£º
Çø±ðIE6
ÓëFF
£º
       background:orange
;*
background:blue
;
Çø±ðIE6
ÓëIE7
£º
       background:green
 !important
;background:blue
;
Çø±ðIE7
Ó ......

CSS×ܽá

CSS »ù´¡Óï·¨
 
µ±Í¬Ò»¸ö HTML ÔªËØ±»²»Ö¹Ò»¸öÑùʽ¶¨Òåʱ£¬»áʹÓÃÄĸöÑùÊ½ÄØ£¿
Ò»°ã¶øÑÔ£¬ËùÓеÄÑùʽ»á¸ù¾ÝÏÂÃæµÄ¹æÔò²ãµþÓÚÒ»¸öеÄÐéÄâÑùʽ±íÖУ¬ÆäÖÐÊý×Ö 4 ÓµÓÐ×î¸ßµÄÓÅÏÈȨ¡£
1.   ä¯ÀÀÆ÷ȱʡÉèÖÃ
2.   ÍⲿÑùʽ±í
3.   ÄÚ²¿Ñùʽ±í£¨Î»ÓÚ <head> ±êÇ©ÄÚ²¿£©
4.&nb ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ