<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content= "IE=edge" /> <meta name="viewport" content="width=device-width,initial-scale=1.0" /><title>flex:property</title> ; 컨테이너 */ .container { display: flex; height: 20rem; border: 1px solid #000; } /* 플렉스 항목 스타일(즉, 하위 요소) */ .container > .item { /* padding: */ /* width: 10rem; 여기서는 10rem을 사용하지 않는 것이 좋습니다. */ width: 100%; border: 1px solid #000; 확대가 허용됨 1 허용됨 0 허용되지 않음*/ /* flex-grow: 1 * //*항목의 축소 허용 여부 설정*/flex-shrink: 1;/*크기 설정 스핀들 공간의 항목*//*Flex 기반: 15rem;*/} /* 유연한 특성 */ </style> </머리> <본문> <div class="컨테이너"> <div class="item">item1</div> <div class="item">item2</div> <div class="item">item3</div> <div class="item">item4</div> </div> </body></html>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
코드가 확인되어 확대/축소가 가능합니다. 스크린샷을 찍어서 보여주실 수 있나요? 아니면 문제가 무엇인지 확인해볼 수 있나요?