인프런 커뮤니티 질문&답변

김수민님의 프로필 이미지

작성한 질문수

퀘이사(Quasar) 완벽 마스터: Vue 프론트 웹을 빠르게 만들고 싶다면! (Based Vue3)

🎉 인스타그램 프로필 페이지 만들기 1 🎉

너비에 따라 row에서 column으로 바꾸는 방법

23.03.03 13:01 작성

·

488

0

 안녕하세요 좋은 강의 만들어주셔서 감사드립니다.

인스타그램 만들기를 따라해보고, 화면을 줄였을 때 (닉네임 - 프로필 편집과 설정)을 row에서 column으로 바꿔보고 싶었습니다

쉬울 것 같았는데 도저히 방법을 모르겠어서 질문드립니다

class에서 row에서 column으로 너비에 따라 바꾸는 방법이 있나요?

답변 1

0

짐코딩님의 프로필 이미지
짐코딩
지식공유자

2023. 03. 03. 15:31

안녕하세요 :)

첫 번째로 $q objectscreen 객체를 활용하여 row, column class를 적용할 수 있을 것 같고요~!
(참고 https://www.inflearn.com/course/lecture?courseSlug=%ED%80%98%EC%9D%B4%EC%82%AC-%EB%A7%88%EC%8A%A4%ED%84%B0-vue-%EC%9B%B9&unitId=133053&tab=curriculum)

두 번째로 인스타그램 페이지 하단 카드 UI를 반응형으로 만든 것 처럼 col-12, col-md-6과 같이 breakpoints를 활용하여 적용할 수 있을 것 같아요 :)