정렬 패널을 사용해 2개 이상의 페이지 요소를 정렬하는 방법에 대해 알아보려면 이 문서를 참조하십시오.

참고:

Adobe Muse는 더 이상 새로운 기능을 추가하지 않으며 2020년 3월 26일 목요일에 지원이 중단됩니다. 자세한 정보 및 지원은 Adobe Muse 서비스 종료 페이지를 참조하십시오.

Adobe Muse 웹 페이지에서 개체 배열

[정렬] 패널을 사용하면 두 개 이상의 페이지 요소를 서로 상대적 기준점으로 삼아서 또는 컨텐트 영역 내에서 쉽게 정렬할 수 있습니다.  반응형 웹 디자인을 사용하면 웹 사이트를 디자인할 장치에 따라 페이지 요소를 정렬할 수 있습니다.

[정렬] 패널을 표시하려면 [창] > [정렬]을 선택하거나 패널 모음에서 [정렬] 탭을 클릭하여 이를 활성화합니다. [정렬] 패널을 열면 [창] 메뉴의 [정렬] 옵션 옆에 확인 표시가 나타납니다.

이 예제에서는 아래쪽에 있는 흘러내리는 커피 방울 이미지를 기준점으로 삼아 Share 단추를 정렬해 보겠습니다. 다음 단계를 따르십시오.

  1. [선택] 도구를 사용하여 Share 단추를 선택합니다. 앞서 갈색 막대 아래 배치해 둔 흘러내리는 커피 방울 이미지도 선택합니다. "Share" 단추를 선택한 상태에서 Shift 키를 누른 채 이 이미지를 선택해야 합니다.

  2. 두 개체를 모두 선택한 상태에서 [정렬] 패널에 표시되는 옵션을 살펴보십시오.

    alignpanel
    [정렬] 패널의 설정을 사용하여 페이지에서 하나 이상의 개체 위치를 지정할 수 있습니다.

    [정렬] 패널의 상단에 있는 메뉴를 사용하여 요소의 정렬 기준점을 선택합니다.

    [선택 항목에 맞춰 정렬]: 선택된 요소들을 서로 상대적 기준점으로 삼아 정렬합니다.

    [컨텐트 영역에 맞춰 정렬]: 하나 이상의 선택된 요소를 그 주위의 컨텐트 영역을 기준점으로 삼아 정렬합니다.

    [개체 정렬] 섹션에서 다음 여섯 가지 설정 중 하나를 선택할 수 있습니다.

    • 왼쪽 가장자리 정렬
    • 가로 가운데 정렬
    • 오른쪽 가장자리 정렬
    • 위쪽 가장자리 정렬
    • 세로 가운데 정렬
    • 아래쪽 가장자리 정렬

    [개체 분포] 섹션에도 여섯 가지 설정이 있습니다.

    • 왼쪽 가장자리 분포
    • 수평 가운데 분포
    • 오른쪽 가장자리 분포
    • 위쪽 가장자리 분포
    • 수직 가운데 분포
    • 아래쪽 가장자리 분포

    이 예제에서는 Share 단추를 흘러내리는 커피 방울 이미지와 수직으로 맞춰 두 개체의 가로 중앙 지점을 가운데 정렬하는 것이 목표입니다.

  3. 상단 메뉴를 [선택 항목에 맞춰 정렬]로 설정한 다음 [가로 가운데 정렬] 단추를 클릭합니다. 각 요소의 가로 중앙 지점이 수직 방향으로 위아래에 나란히 위치하도록 페이지에서 두 요소의 위치가 조정되는 것을 알 수 있습니다.

    참고:

    요소 중 하나를 클릭하여 드래그하는 방법으로 개체를 가운데 정렬할 수도 있습니다. 다른 개체를 기준으로 하여 요소를 정렬하면 해당 요소들이 정렬되었음을 알리는 파란색 선이 잠시 나타납니다.

    fig_48_getting
    요소를 드래그할 때 해당 개체가 페이지의 다른 개체에 맞춰 정렬되면 파란색 선이 나타납니다.

이 작업에는 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License의 라이센스가 부여되었습니다.  Twitter™ 및 Facebook 게시물은 Creative Commons 약관을 적용받지 않습니다.

법적 고지 사항   |   온라인 개인 정보 보호 정책