• 가이드

[실습] 3x3 지그재그 배치하기

이미지 위젯을 왼쪽에, 텍스트 위젯을 오른쪽에 2열 배치하고, 다음 줄부터는 반대로 배치합니다. 이를 반복하면 이미지와 텍스트가 지그재그로 배치됩니다.

실습진행

  1. 디자인 모드에 접속합니다. 접속방법
  2. 이미지 위젯텍스트 위젯을 한 개씩 추가합니다. 위젯 추가방법
  3. 이미지 위젯의 오른쪽에 텍스트 위젯을 배치합니다. 자세한 배치방법은 아래 애니메이션과 함께 지침을 확인합니다.

    1. 텍스트 위젯 하나를 마우스로 클릭합니다.
    2. 첫 번째 이미지 위젯의 오른쪽으로 텍스트 위젯을 드래그합니다.
    3. 첫 번째 이미지 위젯의 오른쪽에 검은 줄이 생기면, 마우스를 놓습니다.
  4. 이미지 위젯과 텍스트 위젯을 새로 추가하고, 이번에는 텍스트 위젯을 이미지 위젯의 왼쪽에 배치합니다. 다음 애니메이션을 참조할 수 있습니다.

  5. 필요한 만큼 이미지 위젯과 텍스트 위젯을 추가해, 좌우 교대로 다르게 배치해봅니다.
  6. 이미지 설정을 열어 이미지를 추가하고, 텍스트 위젯을 마우스 더블-클릭해 글자를 추가합니다.
    참고: 별도로 작성한 글이 없는 경우 다음 한글입숨 사이트를 활용해 예시 한글 문장을 복사해 사용해볼 수 있습니다. 옵션을 선택하고, 생성하기 버튼을 클릭해 복사해 주세요.
  7. 디자인 모드 오른쪽 상단의 미리보기  아이콘을 클릭합니다.
  8. 배치된 위젯들을 확인합니다.
  9. 문제가 없다면 디자인 모드로 돌아가 게시하기 버튼을 클릭합니다.
목록으로

시작이 어려우신가요?

교육 받아보시면 쉽습니다.

온라인 교육 바로가기

한 번 이용하면 팬이 됩니다.

아임웹에서 당신의 생각을 표현해보세요.
568.6K
누적 사이트 이용 수
이미 수만 명이 아임웹 팬이 되어
각자의 생각을 표현하고 있습니다.
315
일 평균 사이트 개설 수
지금 이 순간에도 매일
새로운 브랜드가 소개되고 있습니다.
2.9K
전국 파트너/리셀러 수

아임웹 공식제휴사

아임웹은 페이팔, KG이니시스, 네이버, KCP, 나이스페이, 엑심베이 공식파트너입니다.