css¶¨Î»Ïê½â
ÏÈÀ´¿´ÏÂposition¸÷ÊôÐԵĽâÊÍ
absolute
: Éú³É¾ø¶Ô¶¨Î»µÄÔªËØ£¬Ïà¶ÔÓÚ static ¶¨Î»ÒÔÍâµÄµÚÒ»¸ö¸¸ÔªËؽøÐж¨Î»¡£
ÔªËØµÄλÖÃͨ¹ý "left", "top", "right" ÒÔ¼° "bottom" ÊôÐÔ½øÐй涨
fixed
: Éú³É¾ø¶Ô¶¨Î»µÄÔªËØ£¬Ïà¶ÔÓÚä¯ÀÀÆ÷´°¿Ú½øÐж¨Î»¡£
ÔªËØµÄλÖÃͨ¹ý "left", "top", "right" ÒÔ¼° "bottom" ÊôÐÔ½øÐй涨
relative
: Éú³ÉÏà¶Ô¶¨Î»µÄÔªËØ£¬Ïà¶ÔÓÚÆäÕý³£Î»ÖýøÐж¨Î»¡£
Òò´Ë£¬"left:20" »áÏòÔªËØµÄ LEFT λÖÃÌí¼Ó 20 ÏñËØ¡£
static
: ĬÈÏÖµ¡£Ã»Óж¨Î»£¬ÔªËسöÏÖÔÚÕý³£µÄÁ÷ÖУ¨ºöÂÔ top, bottom, left, right »òÕß z-index ÉùÃ÷£©¡£
inherit
: ¹æ¶¨Ó¦¸Ã´Ó¸¸ÔªËؼ̳Рposition ÊôÐÔµÄÖµ¡£
¸÷ä¯ÀÀÆ÷ĬÈÏÖµÊÇstatic,IE²»Ö§³ÖinheritÊôÐÔ
ͼÖпÉÒÔ¿´³ö£¬Ö»ÄÜÔÚĬÈÏÇé¿öÒ²¾ÍÊǸ¸¶ÔÏópositionΪstatic»òÕß×ÓÔªËØpositionΪfixedʱ×ÓÔªËØ²Å»áÏà¶Ô´°¿Ú½øÐоø¶Ô¶¨Î»£¬Çø±ð¾ÍÊÇÈç¹û½«×ÓÔªËØpositionÉèΪfixedºó£¬×ÓÔªËØ½«»á¸úËæ¹ö¶¯Ìõ¹ö¶¯£¬²»Í¬ÓÚabsolute¡£
µ±ÔªËØpositionΪÏà¶Ô¶¨Î»Ê±£¬Ôò²»ÂÛ¸¸ÔªËض¨Î»Èç¹û£¬¶¼ÎªÏà¶ÔÔÀ´µÄλÖÃÁ÷¾ÍÊÇÆ«ÒÆ,´Ó¶ø¿ÉÒÔ²úÉú¸º±ß¾àµÄЧ¹û
Ïà¹ØÎĵµ£º
µØÕð ÍøÕ¾±ä³É»ÒºÚÉ« css ´úÂë
5.19-5.21Ϊȫ¹ú°§µ¿ÈÕ£¬ °Ù¶È¡¢ÍøÒס¢ÐÂÀ˵ȸ÷´óÍøÕ¾¾ù±ä³ÉÁ˻ҺÚÉ«ÍøÒ³¡£ÔõÑùÊ¹ÍøÒ³±ä³É»ÒºÚɫĨ£¿
¹úÎñÔº¾ö¶¨5ÔÂ19ÈÕÖÁ21ÈÕΪȫ¹ú°§µ¿ÈÕΪ·½±ãÕ¾µã°§µ¿£¬ÌØÌṩcssÂ˾µ´úÂ룬ÒÔ±í°§µ¿¡£ÒÔÏÂΪȫվCSS´úÂë¡£
html {...}{ filter:progid:DXImageTransform.Microsoft.BasicImage(g ......
¸Õ¸ÕÓöµ½Ò»¸öСÎÊÌ⣬²éÁËÏÂ×ÊÁÏŪÃ÷°×ÁË£¬¼Ç¼ÏÂÀ´°É¡£
div.myClassÆ¥Åä<div class="myClass">XXX</div>ÖÐÕû¸ödiv¡£
div .myClassÆ¥Åä<div><span class="myClass">XXX</span></div>ÖеÄspan
×¢Ò⣺ǰÕßÊÇdiv.myClass£¬ºóÕßÔÚdivÓë.myClass¼äÓпոñ
·ÃÎÊÎҵIJ©¿Í²é¿´¸ü¶à£ºÐÄÈçÖ ......
Webǰ¶Ë
ÍøÒ³Éè¼ÆÖÐCSS²¼¾ÖÊǺÜÖØÒªµÄ²¿·Ö£¬ÏÂÃæ½éÉܼ¸ÖÖ¼ì²éµ÷ÊÔCSS²¼¾ÖµÄÓÐЧ·½·¨¡£
¡¡¡¡1. ¼ì²éHTMLÔªËØÊÇ·ñÓÐÆ´Ð´´íÎó¡¢ÊÇ·ñÍü¼Ç½áÊø±ê¼Ç
¡¡¡¡¼´Ê¹ÊÇÀÏÊÖÒ²¾³£»áŪ´ídivµÄǶÌ×¹ØÏµ¡£¿ÉÒÔÓÃdreamweaverµÄÑéÖ¤¹¦Äܼì²éÒ»ÏÂÓÐÎÞ´íÎó¡£
¡¡¡¡2. ¼ì²éCSSÊÇ·ñÊéдÕýÈ·
¡¡¡¡¼ì²éÒ»ÏÂÓÐÎÞÆ´Ð´´íÎó¡¢ÊÇ·ñÍü¼Ç½áβµÄ ......
.inputbox {
padding-left: 2px;
border-top: 1px solid #9AA587;
border-right: 1px solid #DDDDDD;
border-bottom: 1px solid #DDDDDD;
border-left: 1px solid #9A ......
ºÐ×Ó±êÇ©ºÍÊôÐÔ¶ÔÕÕ
CSSÓï·¨£¨²»Çø·Ö´óСд£©
JavaScriptÓï·¨£¨Çø·Ö´óСд£©
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......