ÀúÊýCSSËõдµÄһЩºÃ´¦
ÔÎÄÁ´½Ó£ºhttp://www.fendou163.cn/article/20090115/24807.html
¡¡¡¡WebÍøÕ¾¿ÉÓÃÐԵĹؼüÖ¸±êÊÇËÙ¶È£¬¸üÈ·ÇеØËµ£¬ÊÇÒ³ÃæÄÜÒÔ¶à¿ìµÄËٶȳöÏÖÔÚ·ÃÎÊÕßµÄä¯ÀÀÆ÷´°¿ÚÀï¡£Ó°ÏìËٶȵÄÒòËØÓкܶàÖÖ£¬°üÀ¨Web·þÎñÆ÷µÄËÙ¶È¡¢·ÃÎÊÕßµÄInternetÁ¬½ÓÇé¿ö£¬ÒÔ¼°ä¯ÀÀÆ÷±ØÐëÏÂÔØµÄÎļþ´óС¡£¾¡¹ÜÄãÎÞ·¨¿ØÖÆ·þÎñÆ÷ºÍÁ¬½ÓµÄËÙ¶È£¬µ«ÊÇÄã¿ÉÒÔ¿ØÖƹ¹³ÉÍøÕ¾WebÒ³ÃæµÄÎļþ´óС¡£
¡¡¡¡ÎªÁËÈÃÍøÕ¾Äܹ»¸ü¿ì£¬WebµÄ½¨ÉèÕß¶¼»á°´³£¹æµØÑ¹ËõºÍÓÅ»¯ÍøÕ¾ÉϵÄÿһ¸öͼÏñÎļþ£¬Õâ³£³£Ê¹µÃΪÁ˽«ÎļþµÄ´óС¼õÉÙ¼¸¸ö°Ù·Öµã¶øÎþÉüÁËͼÏñµÄÖÊÁ¿¡£ÓÉÓÚCSSÑùʽ±íÊÇ´¿Îı¾Îļþ£¬ºÍͼÏñÏà±ÈÏà¶Ô½ÏС£¬ËùÒÔWeb½¨ÉèÕߺÜÉÙ¿¼ÂDzÉÈ¡´ëÊ©¼õÉÙÆäCSSÑùʽ±íÎļþµÄ´óС¡£µ«ÊÇ£¬Í¨¹ýʹÓÃCSSËõдÒÔ¼°ÆäËûµÄһЩ¼òµ¥¼¼ÇÉ£¬Äã¿ÉÒÔÔںܴó³Ì¶ÈÉϼõÉÙÑùʽ±íµÄ´óС¡£ÔÚÎÒ¶Ô×Ô¼ºÑùʽ±íµÄÒ»´Î·ÇÕýʽµÄÌØ±ð²âÊÔÖУ¬ÎÒ°ÑÎļþµÄ´óС½µµÍÁË´óÔ¼25-50%¡£
¡¡¡¡Ê¹ÓÃCSSµÄËõдÐÔÖÊ
¡¡¡¡CSSµÄËõдÐÔÖÊ(shorthand property)ÊÇһЩרÓõÄÐÔÖÊÃû£¬ÓÃÀ´´úÌæ¶à¸öÏà¹ØÐÔÖʵļ¯ºÏ¡£ÀýÈ磬¼ä϶ÐÔÖÊ(padding property)ÊǶ¥²¿¼ä϶(padding-top)¡¢ÓÒ²à¼ä϶(padding-right)¡¢µ×²¿¼ä϶(padding-bottom)ºÍ×ó²à¼ä϶(padding-left)µÄËõд¡£
¡¡¡¡Ê¹ÓÃËÙдÐÔÖÊÈÃÄãÄܹ»°Ñ¶à¸öÐÔÖÊ/ÊôÐÔ¶Ô(property/attribute pair)ѹËõ½øCSSÑùʽ±íµÄÒ»ÐдúÂëÀï¡£ÀýÈ磬ÏëÒ»ÏëÏÂÃæµÄ´úÂ룺
¡¡¡¡.sample1 {
¡¡¡¡margin-top: 15px;
¡¡¡¡margin-right: 20px;
¡¡¡¡margin-bottom: 12px;
¡¡¡¡margin-left: 24px;
¡¡¡¡padding-top: 5px;
¡¡¡¡padding-right: 10px;
¡¡¡¡padding-bottom: 4px;
¡¡¡¡padding-left: 8px;
¡¡¡¡border-top-width: thin;
¡¡¡¡border-top-style: solid;
¡¡¡¡border-top-color: #000000;
¡¡¡¡}
¡¡¡¡½«ËüÓÃһЩËõдÐÔÖÊÀ´Ìæ´ú¾ÍÄܹ»°Ñ´úÂë¼õÉÙΪÏÂÃæÕâÑù£¬Á½ÕßµÄʵ¼ÊЧ¹ûÊÇÍêȫһÑùµÄ£º
¡¡¡¡.sample1 {
¡¡¡¡margin: 15px 20px 12px 24px;
¡¡¡¡padding: 5px 10px 4px 8px;
¡¡¡¡border-top: thin solid #000000;
¡¡¡¡}
¡¡¡¡Òª×¢Ò⣬ËõдÐÔÖÊ»¹Óжà¸öÊôÐÔ£¬Ã¿Ò»¸ö(ÊôÐÔ)¶¼¶ÔÓ¦Ò»¸ö±»×éºÏ½øÈëËõдÐÔÖʵij£¹æÐÔÖÊ¡£ÊôÐÔÓɿհ׸ô¿ª¡£
¡¡¡¡µ±ÊôÐÔÊÇÀàËÆµÄÖµµÄʱºò£¬ÀýÈçÓÃÓڱ߿ò¿Õ°×ÐÔÖÊ(margin property)µÄÏßÐÔ²âÁ¿µÄʱºò£¬½ÓÔÚËõдÐÔÖÊÖ®ºóµÄÊôÐÔµÄ˳ÐòºÜÖØÒª¡£ÊôÐԵĴÎÐòÊÇ´Ó¶¥²¿(¶¥²¿µÄ±ß¿ò¿Õ°×)¿ªÊ¼£¬È»ºóÎ§ÈÆ¸ñ×Ó(box)°´Ë³Ê±Õë´ÎÐò¼ÌÐø¡£
¡¡¡¡Èç¹ûËõдÐÔÖʵÄËùÓÐÊôÐÔ¶¼ÊÇÏàͬµÄ£¬ÄÇôÄã¿ÉÒÔ¼òµ¥µØÁгöµ¥¸öÊôÐÔ£¬È
Ïà¹ØÎĵµ£º
Ч¹ûͼ:
Ô´Âë: ±£´æÎªhtmlÎļþ, ÔÚIE6¼°ÒÔÉϰ汾IEä¯ÀÀÆ÷¿ÉÒÔÔËÐÐ....
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
&nb ......
Alpha
1. Óï·¨: {filter: alpha(opacity=opacity, finishopacity=finishopacity, style=style, startx=startx, starty=starty, finishx=finishx, finishy=finishy)}
2. ÒâÒå: °ÑÒ»¸öÄ¿±êÔªËØÓë±³¾°»ìºÏ, ÉèÖÃÕß¿ÉÒÔÖ¸¶¨ÊýÖµÀ´¿ØÖÆ»ìºÏµÄ³Ì¶È
3. ÊôÐÔ
3.1. opacity: ͸Ã÷¶Èˮƽ, 0ΪÍêȫ͸Ã÷, 100ΪÍêÈ«²»Í¸Ã÷
3.2. fin ......
ѧÁËcss¼¸Ì죬·¢ÏÖÓиöÎÊÌâ¡£
ÈçͼËùʾ,×îÍâ²ãÓиödiv£¨·ÛÉ«£©£¬ÄÚ²¿ÉÏÖÐÏÂÈý¸ödiv£¬ÖмädivÄÚÓÐÈý¸öˮƽÅÅÁеÄdiv£¨ÂÌÉ«£©¡£
“middle”divµÄ¸ß¶ÈÊǸù¾ÝÄÚ²¿Èý¸öÂÌÉ«div¸ß¶È±ä»¯µÄ¡£Õâ¸öÓа취ʵÏÖÂð£¿
ÎÒÊÔÁËÊÔ£¬Èç¹ûÈý¸öÂÌÉ«divˮƽÅÅÁеϰ£¬middleµÄ¸ß¶È¾Í²»ÄÜ×Ô¶¯ÊÊÓ¦£¬±ØÐëÖÆ¶¨¸ß¶È¡£ÎÒ°Ñ3¸öÂÌÉ«divÔÝÊ ......
1¡¢²»ÒªÊ¹ÓùýСµÄͼƬ×ö±³¾°Æ½ÆÌ¡£Õâ¾ÍÊÇΪºÎºÜ¶àÈ˶¼²»Óà 1px µÄÔÒò£¬Õâ²ÅÖªÏþ¡£¿í¸ß 1px µÄͼƬƽÆÌ³öÒ»¸ö¿í¸ß 200px µÄÇøÓò£¬ÐèÒª 200*200=40, 000 ´Î£¬Õ¼ÓÃ×ÊÔ´¡£
¡¡¡¡ 2¡¢Îޱ߿ò¡£ÍƼöµÄд·¨ÊÇ border:none;£¬¹þ¹þ£¬ÎÒÒ»Ö±ÔÚÓÃÕâ¸ö¡£ border:0; Ö»ÊǶ¨Òå±ß¿ò¿í¶ÈΪÁ㣬µ«±ß¿òÑùʽ¡¢ÑÕÉ«»¹Êǻᱻä¯ÀÀÆ÷½âÎö£¬Õ¼ÓÃ×Ê ......
×òÌìѧϰÁËCssµÄһС²¿·ÖÊôÐÔ£¬ÕâЩÊôÐÔÒ»Ö±´Ó×òÌìÁ·Ï°µ½½ñÌ죬¸Ð¾õÈç¹ûÏë°ÑÕâЩÊôÐÔÍêÈ«µÄÕÆÎÕÀι̻¹ÐèÒª´óÁ¿µÄÁ·Ï°£¬¿´µ½Í¬Ñ§Ò»¸ö±ÈÒ»¸öѧϰŬÁ¦£¬ÓеÄͬѧÒѾ³¬Ç°Ñ§Ï°£¬ÐÄÀï¸Ðµ½ÆßÉϰËϵģ¬Òò´Ë×Ô¼ºÒ²ÔÚÂýÂý×êÑУ¬²»ÄÜÂäµ½±ðÈ˵ĺóÃæ£¬×òÌìÖ÷ÒªÊÇÁ·Ï°ÁË£¬½ñÌìÖ÷ÒªµÄ×ܽáÁËһЩCssµÄÊôÐÔ£º
Îı¾
font-fa ......