CSS3 box-flex ÊôÐÔ

ʵÀý

¶¨ÒåÁ½¸ö¿ÉÉìËõµÄ p ÔªËØ¡£Èç¹û¸¸ÔªËصÄ×Ü¿í¶ÈÊÇ 300 ÏñËØ£¬Ôò #p1 µÄ¿í¶ÈÊÇ 100 ÏñËØ£¬¶ø #p2 µÄ¿í¶ÈÊÇ 200 ÏñËØ£º

#p1
{
-moz-box-flex:1.0; /* Firefox */
-webkit-box-flex:1.0; /* Safari ºÍ Chrome */
box-flex:1.0;
border:1px solid red;
}

#p2
{
-moz-box-flex:2.0; /* Firefox */
-webkit-box-flex:2.0; /* Safari ºÍ Chrome */
box-flex:2.0;
border:1px solid blue;
}

Ç××ÔÊÔÒ»ÊÔ

ä¯ÀÀÆ÷Ö§³Ö

ĿǰûÓÐä¯ÀÀÆ÷Ö§³Ö box-flex ÊôÐÔ¡£

Firefox Ö§³ÖÌæ´úµÄ -moz-box-flex ÊôÐÔ¡£

Safari¡¢Opera ÒÔ¼° Chrome Ö§³ÖÌæ´úµÄ -webkit-box-flex ÊôÐÔ¡£

¶¨ÒåºÍÓ÷¨

box-flex ÊôÐԹ涨¿òµÄ×ÓÔªËØÊÇ·ñ¿ÉÉìËõÆä³ß´ç¡£

Ìáʾ£º¿ÉÉìËõÔªËØÄܹ»Ëæ×Å¿òµÄËõС»òÀ©´ó¶øËõд»ò·Å´ó¡£Ö»Òª¿òÖÐÓжàÓàµÄ¿Õ¼ä£¬¿ÉÉìËõÔªËØ¾Í»áÀ©Õ¹À´Ìî³äÕâЩ¿Õ¼ä¡£

ĬÈÏÖµ£º 0.0£¨Ö¸Ê¾¸ÃÔªËØ²»¿ÉÉìËõ£©
¼Ì³ÐÐÔ£º no
°æ±¾£º CSS3
JavaScript Óï·¨£º object.style.boxFlex=2.0

Óï·¨

box-flex: value;
Öµ ÃèÊö
value ÔªËØµÄ¿ÉÉìËõÐС£ÈáÐÔÊÇÏà¶ÔµÄ£¬ÀýÈç box-flex Ϊ 2 µÄ×ÓÔªËØÁ½±¶ÓÚ box-flex Ϊ 1 µÄ×ÓÔªËØ¡£
VUE