å± ä¸ä¸ä¸ªå ç´
å¨è¿ä»½æåä¸ä½ å°äºè§£å°æä¸ä¸ªçåå± ä¸æ¾ç½®å¨å¦ä¸ä¸ªä¹ä¸çæ¹æ³ãå¨å¼¹æ§çå模åï¼flexboxï¼åºç°ä¹åï¼è¦åå°åæ¶åç´ä¸æ°´å¹³å± ä¸æ¯å¾å°é¾çï¼èç°å¨å©ç¨çå对é½å±æ§ï¼Box Alignmentï¼å°±å¾ç´æªäºå½äºã
éæ±
æä¸ä¸ªé¡¹ç®åæ¶åç´ä¸æ°´å¹³å± ä¸å°æ¾ç½®å¨å¦ä¸ä¸ªçåä¸ã
æå
ååºéæ©
è¦å°ä¸ä¸ªçåå±
ä¸æ¾ç½®å¨å¦ä¸ä¸ªä¹ä¸ï¼æ们éè¦è®©ä½ä¸ºå®¹å¨ççååæ伸缩容å¨ãåå° align-items 设置为 center æ¥å®ç°ååè½´ï¼block axisï¼ä¸çå±
ä¸ï¼å¹¶æ justify-content 设置为 center æ¥å®ç°è¡åè½´ï¼inline axisï¼ä¸çå±
ä¸ã
å°æ¥æ们å¯è½ä¸éè¦å°ç¶å®¹å¨è®¾ç½®ä¸ºä¼¸ç¼©å®¹å¨å°±å¯ä»¥å± ä¸å ç´ ï¼å 为æ¤å¤ä½¿ç¨çâçå对é½âå±æ§ä¹è¢«æå®ä¸ºéç¨äºåºåå¸å±ãç¶èï¼å½åå¨åºåå¸å±ä¸å¯¹çå对é½å±æ§çæ¯æä»ç¶æ¯æéçï¼å æ¤ç®å使ç¨ä¼¸ç¼©çåæ¥å®ç°å± ä¸è¿æ¯æå¯é çæ¹æ³ã