반응형 코딩시 가로배열 채택완료
동물원
3년 전
조회 1,965
반응형으로 코딩을 할때 예를들어
<div class="col-lg-6"> 같은 형식으로 코딩을 하면 화면크기에 따라서
큰 화면은 한줄에 2개씩 보이다가 모바일 사이즈에서는 한줄로 보이게 되는데요.
이것을 가로100% 에 맞춰서 이미지 사이즈가 줄어들면서 한줄에 똑같이 2개씩
보이게 하려면 어떻게 해야 하나요?
마찬가지로 가로폭에 맞춰서 사이즈에 상관없이
<div class="col-lg-3"> 이면 한줄에 4개씩
<div class="col-lg-4"> 이면 한줄에 3개씩
<div class="col-lg-6"> 이면 한줄에 2개씩 보이게 하고 싶습니다.
댓글을 작성하려면 로그인이 필요합니다.
답변 3개
채택된 답변
+20 포인트
3년 전
클래스명을 보면 부트스트랩을 이용하시는거 같습니다.
부트스트랩 3 기준으로 col-xs-6 바꾸시면 모바일~PC 사이즈까지
2 column으로 보이게 됩니다.
img 태그에는 img-responsive를 클래스에 추가해 주시면 반응형 처리 됩니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 3개
�
동물원
3년 전
�
크리스휘
3년 전
img 태그에 img-responsive 클래스를 추가해 주셨을까요?
�
동물원
3년 전
답변주신 내용 참조해서 여러번 시행착오를 거듭해서 어찌어찌 찾아가면서 해결 했습니다.
배워야 할 게 많네요.^^ 도움 감사합니다.
배워야 할 게 많네요.^^ 도움 감사합니다.
댓글을 작성하려면 로그인이 필요합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
3열 (col-xs-4)로 배열했을때, 가로폭이 최소인 경우에도 이미지 사이즈가 각 열의 크기를 넘기지 않고 열 크기에 맞춰 조정되고 3열이 유지되게 하는 방법이 있을까요?