CSS ExpressionÓ÷¨×ܽá
CSS ExpressionÓ÷¨×ܽá
ת×Ôhttp://www.chencheng.org/demo/css-expression.php
CSS Expression£¬¶¯Ì¬ CSS ÊôÐÔ£¬IE ˽ÓУ¬×Ô 5.0 ¿ªÊ¼ÒýÈ루IE8 ½«²»ÔÙÖ§³Ö£©£¬²Î¿¼ MSDN£¬²»¹ýÓÐʱÓÃjavascript¶¯Ì¬Éú³ÉËü×÷ΪIE6µÄhack»¹ÊDz»´íµÄ£¡
ÕⶫÎ÷µÄÓŵ㣺
ʹ CSS ÊôÐÔ¶¯Ì¬Éú³É£¬ËùÒÔ»ù±¾ js ÄܸɵÄËü¶¼ÄܸÉ
ʹÓà CSS Ñ¡Ôñ·û£¬±È js ±éÀúµ½Ä³¸öÌض¨ÔªËØÒª·½±ãµÃ¶à
ÕⶫÎ÷µÄȱµã£º
expression »á·´¸´Ö´ÐУ¬ÓÐÑÏÖصÄЧÂÊÎÊÌâ¡£ËüµÄ´¥·¢Ëƺõ²»ÊÇͨ¹ýʼþ£¬¶øÊÇͨ¹ý interval Ò»ÀàµÄ»úÖÆ¡£
±ðµÄä¯ÀÀÆ÷²»Ö§³Ö£¬IE8 Ò²½«²»ÔÙÖ§³Ö
IE6 µÄ±³¾°ÉÁ˸ Bug Fix
1.body {
2. zoom: expression(function(el){
3. document.execCommand('BackgroundImageCache', false, true);
4. el.style.zoom = '1';
5. }(this));
6.}
¸ø²»Í¬ type µÄ input ¸³Ó費ͬµÄÑùʽ
1.input {
2. zoom: expression(function(el){
3. el.style.zoom = "1";
4. el.className ? el.className+=" "+el.type : el.className=el.type;
5. }(this));
6.}
¸ôÐл»É«£¨zebra lists£©
01..test {
02. unicode-bidi: expression(function(el){
03. el.style.unicodeBidi = "normal";
04. var childs = el.getElementsByTagName("li");
05. for(var i=0; i<childs.length; i++){
06. (i % 2)?childs[i].className+=" even":childs[i].className+=" odd";
07. }
08. }(this));
09.}
Ä£Äâ :before »òÕß :after
01..test {
02. letter-spacing: expression(function(el){
03. el.style.letterSpacing = "0";
04. var newchild = document.createElement("span");
0
Ïà¹ØÎĵµ£º
ÔÎÄ´«ËÍÃÅ£ºhttp://blog.csdn.net/dux003/archive/2009/11/08/4786371.aspx
csdn blog css×Ô¶¨ÒåÉèÖÃ
¿ÉÒÔÔÚ²©¿ÍµÄÅäÖÃÒ³ÃæµÄ×Ô¶¨ÒåcssÀ¸ÖÐÌîÈëcssÑùʽ´úÂëÀ´×Ô¶¨Ò²blogµÄ·ç¸ñ
csdn blogµÄÒ³Ãæ¼Ü¹¹»ù±¾ÊÇÓÉdivʵÏֵģ¬Õû¸öÒ³ÃæÖ÷ÒªÓÉÈý¸ödiv×é³É£¬ËüÃǵÄid·Ö±ðÊÇ:
csdnblog_header, csdnblog_sidebar, csdnblog_conten ......
ÄÚ²¿Ñùʽ±í
ÄÚ²¿Ñùʽ±íÐèÒªÔÚÍøÒ³µÄ<head>²¿·Ö¶¨Ò壬¸ñʽÈçÏ£º
<head>
<style type="text/css">
/*·ûºÏCSSÓï·¨½á¹¹µÄCSSÓï¾ä£¬ÀýÈç*/
body { background-color: blue; }
</style>
</head>
ÐÐÄÚÑùʽ±í(ÄÚǶÑùʽ±í)
ÐÐÄÚÑùʽ±íÖ±½ÓÔÚ±êÇ©ÄÚ²¿¶¨Ò壬ʹÓÃstyleÊôÐÔ£¬Ð´·¨ÈçÏ£º
......
ÔÚ¹úÄÚÍøÕ¾ÖУ¬°üÀ¨Èý´óÃÅ»§£¬ÒÔ¼°“ÒýÁì”ÖйúÍøÕ¾Éè¼Æ³±Á÷µÄÀ¶É«ÀíÏ룬ChinaUIµÈ¶¼ÊÇʹÓÃÁËpx×÷Ϊ×ÖÌ嵥λ¡£Ö»ÓаٶȺôõ×öÁ˸ö¿Éµ÷µÄ±íÂÊ¡£¶øÔÚ´óÑó±Ë°¶£¬¼¸ºõËùÓеÄÖ÷Á÷Õ¾µã¶¼Ê¹ÓÃem×÷Ϊ×ÖÌ嵥룬Ҳ¾ÍÊǿɵ÷µÄ¡£Ã»´í£¬px±Èem¸ü¼ÓÈÝÒ×ʹÓ㬴󲿷ֶÁÕß²»ÖªµÀemΪºÎÎï»òÕßËüÏ൱ÓÚ¶àÉÙpx¡£¹úÍâÈËÊ¿Èç´ËÖØÊÓÍøÕ ......
½ñÌìÊÜһͬѧµÄίÍУ¬½ÓÁËÒÔ¸öÍøÕ¾µÄÃÀ¹¤µÄ»î£¡Ö÷ÒªÊÇ×öCSS·½ÃæÉè¼ÆµÄÎÊÌ⣬Õâ·½ÃæµÄ¶«Î÷ÎÒ»¹±È½Ïϲ»¶×ö£¬ÒòΪ¶¼ÊÇһЩÃÀºÃµÄ¶«Î÷Â²¢ÇÒËù¼û¼´ËùµÃ¡£
ÆäʵCSSÕâ¸ö¶«Î÷²¢²»ÄÑ£¬±ÈÆðËã·¨ºÍ³ÌÐòÉè¼ÆÈÝÒ׶àÁË£¬ÄѵÃÊÇÔõôÓã¡
CSSÎÞ·Ç°üÀ¨¿ò¼Ü£¬²¼¾Ö£¬×ÖÌ壬ÑÕÉ«£¬ÕâËĸö²¿·Ö¡£
¸öÈ˸оõÏëѧºÃCSSûÓбðµÄ×ÅÊý£¬Ö»ÓÐÈÏÈÏÕæ ......
ÎÒÃÇ¿ÉÒÔͨ¹ýCSSÊôÐÔfloatÁîÔªËØÏò×ó»òÏòÓÒ¸¡¶¯¡£Ò²¾ÍÊÇ˵£¬ÁîºÐ×Ó¼°ÆäÖеÄÄÚÈݸ¡¶¯µ½Îĵµ£¨»òÕßÊÇÉϲãºÐ×Ó£©µÄÓұ߻òÕß×ó±ß£¨²Î¼ûµÚ9¿Î¹ØÓÚºÐ×´Ä£Ð͵ÄÃèÊö£©¡£ÏÂͼ²ûÃ÷ÁËÆäÔÀí£º
¾Ù¸öÀý×Ó£¬¼ÙÈçÎÒÃÇÏëÈÃÒ»ÕÅͼƬ±»Ò»¶ÎÎÄ×ÖΧÈÆ×Å£¬ÄÇôÆäÏÔʾЧ¹û½«ÈçÏÂËùʾ£º
ÈçºÎʵÏÖÕâ¸öЧ¹û£¿
ÉÏÀýµÄHTML´úÂëÈçÏÂËùʾ£º
<div i ......