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

CSSÂ˾µµÄʹÓ÷½·¨

CSSÂ˾µµÄʹÓ÷½·¨£ºfilter:filtername(parameters)¡¡¼´ filter:Â˾µÃû³Æ£¨²ÎÊý£©
alpha£ºÉèÖÃ͸Ã÷²ã´Î
blur£º´´½¨¸ßËÙ¶ÈÒÆ¶¯Ð§¹û£¬¼´Ä£ºýЧ¹û
chroma£ºÖÆ×÷רÓÃÑÕɫ͸Ã÷
DropShadow£º´´½¨¶ÔÏóµÄ¹Ì¶¨Ó°×Ó
FlipH£º´´½¨Ë®Æ½¾µÏñͼƬ
FlipV£º´´½¨´¹Ö±¾µÏñͼƬ
glow£º¼Ó¹â»ÔÔÚ¸½½ü¶ÔÏóµÄ±ßÍâ
gray£º°ÑͼƬ»Ò¶È»¯
invert£º·´É«
light£º´´½¨¹âÔ´ÔÚ¶ÔÏóÉÏ
mask£º´´½¨Í¸Ã÷ÑÚĤÔÚ¶ÔÏóÉÏ
shadow£º´´½¨Æ«Òƹ̶¨Ó°×Ó
¾ßÌåµÄÓ¦ÓÃÓÐÁ½ÖÖ·½·¨£º
1¡¢Ïȶ¨ÒåºÃCSS £¬ÔÙÔÚÒ³ÃæÖÐÐèÒªµÄ¶ÔÏóÉÏʹÓÃÔ¤Ïȶ¨ÒåºÃµÄCSS£¬Êµ¼ÊÉÏCSSµÄÉèÖöԻ°¿òÀïÒѾ­Ô¤ÏȽ«ÕâЩÂ˾µµÄÓï·¨ÉèÖúÃÁË£¬ÎÒÃÇÖ»ÐèÌîÉÏÊʺϵľßÌå²ÎÊý¼´¿É£º
2¡¢Ö±½ÓÔÚÖ§³ÖCSSÂ˾µÐ§¹ûµÄHTML¿Ø¼þÔªËØÉϱàдCSS filter´úÂë¡£
AlphaÂ˾µ: Ìýµ½Õâ¸öÃû×Ö£¬Äã¿ÉÄÜ»áÏëµ½FlashÀïÓУ¬PhotoshopÀïÒ²ËÆºõ¼û¹ý¡£Ò»µã²»´í£¬ËüÃǵÄ×÷Óûù±¾ÀàËÆ£¬¾ÍÊǰÑÒ»¸öÄ¿±êÔªËØÓë±³¾°»ìºÏ¡£Äã¿ÉÒÔÖ¸¶¨ÊýÖµÀ´¿ØÖÆ»ìºÏµÄ³Ì¶È¡£ÕâÖÖ“Óë±³¾°»ìºÏ"ͨË×µØËµ¾ÍÊÇÒ»¸öÔªËØµÄ͸Ã÷¶È.
Óï·¨£ºSTYLE="filter: Alpha(Opacity=opacity, FinishOpacity=finishopacity£¬Style=style, StartX=startX£¬StartY=startY£¬FinishX=finishX£¬FinishY=finishY)"
˵Ã÷£º
Opacity£ºÆðʼֵ£¬È¡ÖµÎª0¡«100, 0Ϊ͸Ã÷£¬100Ϊԭͼ¡£
FinishOpacity£ºÄ¿±êÖµ¡£
Style£º1»ò2»ò3
StartX£ºÈÎÒâÖµ
StartY£ºÈÎÒâÖµ
Àý×Ó£ºfilter:Alpha(Opacity="0″,FinishOpacity="75″,Style="2″)
BlurÂ˾µ:ÊÇCSSµÄÂ˾µÖ®Ò»£¬°ÑËü¼ÓÔØµ½ÎÄ×ÖÉÏ£¬¿É²úÉúÁ¢Ìå×ÖµÄЧ¹û£¬Õ⽫ΪÄãÔÚÍøÒ³ÉÏʹÓÃÁ¢Ìå×Ö×ö±êÌâ´øÀ´Á˼«´óµÄ·½±ã£¬Ò²ÎªÄãµÄÍøÒ³¼õÇáÁË·ÖÁ¿£»°ÑBlurÂ˾µ¼ÓÔØµ½Í¼Æ¬ÉÏ£¬ÄÜʹÄãµÄͼƬÔöÉ«²»ÉÙ£¬ËäÈ»ÓÃͼÏó´¦ÀíÈí¼þÒ²ÄܴﵽͬÑùЧ¹û£¬µ«ÓÃBlurÂ˾µ¿É·½±ã¶àÁË.
Óï·¨£ºSTYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
˵Ã÷£º
Add£ºÒ»°ãΪ1£¬»ò0¡£
Direction£º½Ç¶È£¬0¡«315¶È£¬²½³¤Îª45¶È¡£
Strength£ºÐ§¹ûÔö³¤µÄÊýÖµ£¬Ò»°ã5¼´¿É¡£
Àý×Ó£ºfilter:Blur(Add="1″,Direction="45″,Strength="5″)
ChromaÂ˾µ:ÉèÖöÔÏóµÄÉ«²ÊŨ¶È
Óï·¨£ºSTYLE="filter:Chroma(Color = color)"
˵Ã÷£ºcolor£º#rrggbb¸ñʽ£¬ÈÎÒâ¡£
Àý×Ó£ºfilter:Chroma(Color="#FFFFFF")
DropShadowÂ˾µ:¹ËÃû˼Òå¾ÍÊÇÌí¼Ó¶ÔÏóµÄÒõӰЧ¹û¡£ËüµÄʵ¼ÊЧ¹û¿´ÉÏÈ¥¾ÍÏóÊÇÔ­À´µÄ¶ÔÏóÀ뿪ÁËÒ³Ãæ£¬È»ºóÔÚÒ³ÃæÉÏÏÔʾ³ö¸Ã¶ÔÏóµÄͶӰ¡£Æä¹¤×÷Ô­ÀíÊ


Ïà¹ØÎĵµ£º

js+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>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> &nb ......

cssÍøÒ³±³¾°½¥±ä

<style  type="text/css">
/*
  ´ÓÉÏÍùϽ¥±ä
*/
body
{
   FILTER:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#003C9F,endColorStr=white);
}
/*
  ´Ó×óÉÏÖÁÓÒϽ¥±ä
*/
body
{
   background-color:skyblue;
   FILTE ......

CSS»ù´¡ÖªÊ¶

1¡¢CSSµÄÓï·¨ÊÇÕâÑùµÄ£ºselector {property: value}
selector-Ñ¡ÔñÆ÷£¨±ÈÈçbody¡¢div¡¢h2……£©
property-ÊôÐÔ £¨±ÈÈçbackground-color¡¢hidden¡¢text-align……£©
value-Öµ£¨±ÈÈçyellow¡¢blue¡¢12px¡¢center……£©
[×¢]£º
a¡¢³ýidÍâ´óСд²»Ãô¸Ð
b¡¢value´æÔÚ¶à¸öµ¥´Êʱ£¬ÒªÓÃÒ ......

css²¼¾ÖµÄ¿Ú¾÷

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