답변 2개
채택된 답변
+20 포인트
coDribble
2년 전
마크업 순서가
내용 / 사진
사진 / 내용
으로 되어 있어서 그렇습니다
마크업을
내용 / 사진
내용 / 사진
순으로 마크업 하고
css 로 컨트롤 하시면 됩니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
c
coDribble
2년 전
댓글을 작성하려면 로그인이 필요합니다.
Feelz996
2년 전
display:flex 를 사용하고 자식 속성에 order 값을 변경해 주면 출력하는 위치 순서를 바꿀수 있습니다.
<div class='wrapper'>
<div class='div1'></div>
<div class='div2'></div>
</div>
.wrapper{display:flex;}
.div1{order:2;}
.div2{order:1;}
간단한 예를 들면 이렇게요.
모든 내용들을
내용 사진 순서로 구성해 놓고 pc 일경우 짝수 줄에만 order를 사용해서
사진 내용으로 나오게끔 구성하면 될것 같습니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
pc에서 첫 콘텐츠는 정렬 순서가 마크업된 순서 그대로니깐 nth-child(even) 으로 짝수번째 콘텐츠들을 컨트롤 하시면 됩니다