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

CSS Border


Ê×ÏÈҪ˵µÄÊÇÔªËØµÄborder£¬ÔªËصı߿ò (border) ÊÇÎ§ÈÆÔªËØÄÚÈݺÍÄڱ߾àµÄÒ»Ìõ»ò¶àÌõÏß¡£CSS border ÊôÐÔÔÊÐíÄã¹æ¶¨ÔªËر߿òµÄÑùʽ¡¢¿í¶ÈºÍÑÕÉ«¡£
CSS ±ß¿ò
ÔÚ HTML ÖУ¬ÎÒÃÇʹÓñí¸ñÀ´´´½¨Îı¾ÖÜΧµÄ±ß¿ò£¬µ«ÊÇͨ¹ýʹÓà CSS ±ß¿òÊôÐÔ£¬ÎÒÃÇ¿ÉÒÔ´´½¨³öЧ¹û³öÉ«µÄ±ß¿ò£¬²¢ÇÒ¿ÉÒÔÓ¦ÓÃÓÚÈκÎÔªËØ¡£
ÔªËØÍâ±ß¾àÄÚ¾ÍÊÇÔªËØµÄµÄ±ß¿ò (border)¡£ÔªËصı߿ò¾ÍÊÇÎ§ÈÆÔªËØÄÚÈݺÍÄڱ߾ݵÄÒ»Ìõ»ò¶àÌõÏß¡£
ÿ¸ö±ß¿òÓÐ 3 ¸ö·½Ã棺¿í¶È¡¢Ñùʽ£¬ÒÔ¼°ÑÕÉ«¡£
±ß¿òµÄÑùʽ
ÑùʽÊDZ߿ò×îÖØÒªµÄÒ»¸ö·½Ã棬Õâ²»ÊÇÒòΪÑùʽ¿ØÖÆ×ű߿òµÄÏÔʾ£¨µ±È»£¬Ñùʽȷʵ¿ØÖÆ×ű߿òµÄÏÔʾ£©£¬¶øÊÇÒòΪÈç¹ûûÓÐÑùʽ£¬½«¸ù±¾Ã»Óб߿ò¡£Ò²¾ÍÊÇ˵£º"border-width"ºÍ"border-color"ÊôÐÔ²»Äܵ¥¶ÀʹÓã¬ÐèÒªÏÈÓà "border-style“ÊôÐԹ涨±ß¿òÖ®ºó²Å¿ÉÒÔʹÓá£
CSS µÄborder-style ÊôÐÔ¶¨ÒåÁË 10 ¸ö²»Í¬µÄ·Ç inherit Ñùʽ£¬°üÀ¨ none¡£Ò²¿ÉÒÔΪһ¸ö±ß¿ò¶¨Òå¶à¸öÑùʽ£¬ÀýÈ磺
p.aside {border-style: solid dotted dashed none;}
ÉÏÃæÕâÌõ¹æÔòΪÀàÃûΪ aside µÄ¶ÎÂ䶨ÒåÁËËÄÖֱ߿òÑùʽ£ºÊµÏßÉϱ߿ò¡¢µãÏßÓұ߿ò¡¢ÐéÏßϱ߿òºÍÒ»¸ö²»´æÔÚµÄ×ó±ß¿ò¡£
ÎÒÃÇÓÖ¿´µ½ÁËÕâÀïµÄÖµ²ÉÓÃÁË top-right-bottom-left µÄ˳Ðò£¬ÌÖÂÛÓöà¸öÖµÉèÖò»Í¬Äڱ߾àʱҲ¼û¹ýÕâ¸ö˳Ðò¡£
±ß¿òµÄ¿í¶È
¿ÉÒÔͨ¹ý border-width ÊôÐÔΪ±ß¿òÖ¸¶¨¿í¶È¡£¿ÉÒÔÖ¸¶¨³¤¶ÈÖµ£¬»òÕßʹÓà 3 ¸ö¹Ø¼ü×ÖÖ®Ò»¡¾thin, medium£¨Ä¬ÈÏÖµ£©, thick¡¿À´¶¨Òå±ß¿òµÄ¿í¶È¡£
±ß¿òµÄÑÕÉ«
ÉèÖñ߿òÑÕÉ«·Ç³£¼òµ¥¡£CSS ʹÓÃÒ»¸ö¼òµ¥µÄ border-color ÊôÐÔ£¬ËüÒ»´Î¿ÉÒÔ½ÓÊÜ×î¶à 4 ¸öÑÕɫֵ¡£Èç¹ûûÓÐΪ±ß¿òÉùÃ÷ÑÕÉ«£¬Ëü½«ÓëÔªËØµÄÎı¾ÑÕÉ«Ïàͬ¡£ÁíÒ»·½Ã棬Èç¹ûÔªËØÃ»ÓÐÈκÎÎı¾£¬¼ÙÉèËüÊÇÒ»¸ö±í¸ñ£¬ÆäÖÐÖ»°üº¬Í¼Ïñ£¬ÄÇô¸Ã±íµÄ±ß¿òÑÕÉ«¾ÍÊÇÆä¸¸ÔªËØµÄÎı¾ÑÕÉ«£¨ÒòΪ color ¿ÉÒԼ̳У©¡£Õâ¸ö¸¸ÔªËغܿÉÄÜÊÇ body¡¢div »òÁíÒ»¸ö table¡£
͸Ã÷±ß¿ò
Èç¹û±ß¿òûÓÐÑùʽ£¬¾ÍûÓпí¶È¡£²»¹ýÓÐЩÇé¿öÏÂÄú¿ÉÄÜÏ£Íû´´½¨Ò»¸ö²»¿É¼ûµÄ±ß¿ò¡£
CSS2 ÒýÈëÁ˱߿òÑÕɫֵ transparent¡£Õâ¸öÖµÓÃÓÚ´´½¨Óпí¶ÈµÄ²»¿É¼û±ß¿ò¡£´ÓijÖÖÒâÒåÉÏ˵£¬ÀûÓà transparent£¬Ê¹Óñ߿ò¾ÍÏñÊǶîÍâµÄÄڱ߾àÒ»Ñù£»´ËÍ⻹ÓÐÒ»¸öºÃ´¦£¬¾ÍÊÇÄÜÔÚÄãÐèÒªµÄʹÓÃʹÆä¿É¼û¡£ÕâÖÖ͸Ã÷±ß¿òÏ൱ÓÚÄڱ߾࣬ÒòÎªÔªËØµÄ±³¾°»áÑÓÉìµ½±ß¿òÇøÓò£¨Èç¹ûÓпɼû±³¾°µÄ»°£©¡£
ÖØÒªÊÂÏÔÚ IE7 ֮ǰ£¬IE/WIN ûÓÐÌṩ¶Ô transparent µÄÖ§³Ö¡£ÔÚÒÔǰµÄ°æ±¾£¬IE »á¸ù¾ÝÔªËØµÄ color ÖµÀ´ÉèÖñ߿òÑÕ


Ïà¹ØÎĵµ£º

dz̸IEÓëFirefox¶ÔCSSµÄ²»Í¬½âÎö

¡¡
¡¡Æäʵ£¬ÒÔǰ´ÓÀ´Ã»ÓнӴ¥¹ýCSSÏà¹ØµÄÄÚÈÝ£¬¶¼ÊÇÔÚ×öÒµÎñµÄ±à³Ì£¬´ÓÀ´Ã»Ïë¹ýÇ°Ì¨Ò³ÃæµÄÉè¼ÆÒ²ÄÜÈç´Ë¸´ÔÓ¡£Õâ´ÎÏîÄ¿µÄ¿ª¹ý¹ý³ÌÖУ¬×÷ΪCSS²ËÄñµÄÎÒÒ²
½Ó´¥µ½CSSµÄÏà¹ØÉè¼Æ¡£Ëù³öÏֵĵͼ¶ÎÊÌâºÍÀ˷Ѻܶàʱ¼äµÄ×´¿öÒ²²ã³ö²»ÇËùÒÔͨ¹ý¸÷·½ËÑË÷ºÍ×Ô¼ºµÄʵ¼ÊѧϰÖÐ×ܽá³ö¼¸µãIEºÍFirefox¶ÔCSS
µÄÇø±ð£¬¸ø´ó¼Ò½è¼ø¡£
¡¡¡ ......

css²¼¾ÖµÄ¿Ú¾÷

css²¼¾ÖµÄʱºò¶à¶à×¢Òâһϣ¬ÏàÐźܿì¾Í¿ÉÒÔÕÆÎÕÁËcss²¼¾ÖµÄ¼¼ÇÉ£¡
Ò»¡¢IE±ß¿òÈôÏÔÈôÎÞ£¬Ðë×¢Ò⣬¶¨ÊǸ߶ÈÉèÖÃÒÑÍü¼Ç£»
¶þ¡¢¸¡¶¯²úÉúÓÐÔµ¹Ê£¬ÈôÒª¸¸²ã°üº¬×¡£¬½ô¸ú¸¡¶¯ÒªÇå³ý£¬ÈÝÆ÷×ÔÈ»ÏÔÆäÖУ»
Èý¡¢ÈýÏñËØÎı¾ÂýÒÆ²»±Ø»Å£¬¸ß¶ÈÉèÖðïÄãæ£»
ËÄ¡¢¼æÈݸ÷¸öä¯ÀÀÐë×¢Ò⣬ĬÈÏÉèÖÃÐи߿ÉÄÜÊÇɱÊÖ£»
Îå¡¢¶ÀÁ¢Çå³ý¸¡¶¯ÐëÃú¼Ç ......

CSSÄ£°åÊÇÔõôÁ¶³ÉµÄ

×÷Õß:ÀîÀöæÂ
ÓÊÏ䣺lly219@gmail.com
ÈÕÆÚ£º2009-1-12
ǰÑÔ£¨×Ô˵×Ô»°£©
´Ó³õʶCSSµ½ÏÖÔÚÒѾ­5¸öÄêÍ·ÁË¡£´ó¶àÊǶ϶ÏÐøÐøµÄ£¬¿ÉÊǽüÒ»ÄêÀ´½Ó´¥ÆÄ¶à£¬ÉõÓÐһЩЩÌå»á¡£
µÚÒ»´Î½Ó´¥Ö»ÖªµÀfont£¬color£¬background£¬margin£¬paddingµÈ»ù±¾ÖªÊ¶£¬ÄËÖÁÁ¬margin¡¢padding¶¼·Ö²»Çå¸öËùÒÔÈ»¡£
ÔÚµÚÒ»´ÎWeb´ó×÷ÒµÖÐÖªµÀÁËÓÐ&ldq ......

IE6ÏÂcss¶¨ÒåDIV¸ß¶ÈµÄÎÊÌâ


IE6ÏÂĬÈϵÄ×ÖÌå³ß´ç´óÖÂÔÚ 12 – 14px Ö®¼ä£¬µ±ÄãÊÔͼ¶¨ÒåÒ»¸ö¸ß¶ÈСÓÚÕâ¸öĬÈÏÖµµÄ div µÄʱºò£¬ IE »á¹ÌÖ´µÄÈÏΪÕâ¸ö²ãµÄ¸ß¶È²»Ó¦¸ÃСÓÚ×ÖÌåµÄÐиߡ£ËùÒÔ¼´Ê¹ÄãÓà height:4px; À´¶¨ÒåÁËÒ»¸ö div µÄ¸ß¶È£¬Êµ¼ÊÔÚ IE ÏÂÏÔʾµÄÈÔÈ»ÊÇÒ»¸ö 12 px ×óÓҸ߶ȵIJ㡣Ìí¼Óoverflow: hidden½â¾öÎÊÌâ¡£
<div style=&rdquo ......

JSPÒ³ÃæÖÐÎÞ·¨ÏÔʾCSSÖеı³¾°Í¼Æ¬

jspÒ³Ãæµ÷Óà <link type="text/css" rel="stylesheet" href="css/style.css"/>Ñùʽ±í
ÆäËûÑùʽ¶¼¿ÉÒÔÔÙÒ³ÃæÕý³£ÏÔʾ
.button-qingchu{background:url(images/qingchu.jpg); width:70px; height:30px; border:0px;} ÏñÕâÑùµÄ±³¾°Í¼Æ¬Ñùʽ¾ÍÏÔʾ²»³öͼƬÊÇʲôÎÊÌ⣡ Myeclipse 6.5
ÔÚhtmlÖж¼¿ÉÒÔÏÔʾ ÔÚjspÖÐÏÔʾ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ