Adobe Muse에서 텍스트로 작업하는 방법을 알아봅니다. [텍스트] 패널을 사용하여 텍스트 모양을 수정하고, 여백을 추가하고, 들여쓰기 값 등을 설정합니다.

참고:

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

웹 사이트를 디자인할 때 Adobe Muse를 사용하여 다음과 같은 방법으로 텍스트를 추가할 수 있습니다.

  • 텍스트 상자를 추가한 다음 텍스트 상자 안에 내용을 입력하기 시작합니다.
  • 텍스트를 텍스트 파일에 저장하고 이 파일을 Adobe Muse 페이지로 가져옵니다.
  • InDesign과 같은 응용 프로그램을 사용하여 텍스트를 배치합니다. 미리 서식이 지정된 이 텍스트를 클립보드에 복사하여 Adobe Muse로 붙여 넣습니다.

반응형 레이아웃의 경우 사용자가 웹 사이트를 보는 장치에 따라 텍스트 서식을 지정할 수도 있습니다. 예를 들어, 스마트폰용 텍스트는 데스크톱 버전과 비교하여 더 크고 여백이 더 많게 만들 수 있습니다. 또한 Adobe Muse에서 반응형 웹을 디자인하면 각 중단점에 대한 텍스트 서식을 지정할 수도 있습니다. 각 중단점의 텍스트 스타일, 색상, 행간, 여백 및 크기를 변경할 수 있습니다. 단일 파일에서 여러 장치에 대한 웹 사이트를 만들 때 텍스트 서식을 지정하는 방법에 대한 자세한 내용은 반응형 레이아웃에 텍스트 서식 지정을 참조하십시오.

텍스트 프레임을 만들고 스타일 지정

메뉴를 채우기 위해 외부 텍스트 파일에서 메뉴 텍스트를 복사한 뒤 텍스트 프레임에 붙여 넣을 것입니다. 또한 단락 스타일을 만들고 적용하여 텍스트 스타일을 지정할 것입니다. 다음 단계를 따르십시오.

  1. 디자인 보기에서 페이지를 편집하는 동안 텍스트 프레임을 만들려면 [텍스트] 도구를 사용합니다. 다른 파일 소스에서 텍스트를 복사하려면 텍스트를 복사하고 Adobe Muse에서 [텍스트] 도구를 사용하여 텍스트 프레임 내부를 클릭하세요. 복사한 텍스트 내용을 텍스트 프레임에 붙여 넣습니다.

  2. [텍스트] 도구를 사용하여 텍스트의 아무 행을 선택합니다.

  3. [텍스트] 패널에서 다음 설정을 사용하여 텍스트 서식을 지정합니다.

    • 글꼴: Droid Serif Bold(또는 사용자가 원하는 serif 글꼴)
    • 글꼴 크기: 14 글꼴
    • 스타일: 볼드체 글꼴
    • 색상: #A6342A(빨간색)
    • 정렬: 왼쪽 맞춤
    • 행간: 120%
  4. 다음과 같은 추가 텍스트 형식을 사용하여 추가로 텍스트 서식을 지정합니다.

    • 위 첨자
    • 아래 첨자
    • 대문자
    • 소문자
  5. 텍스트가 여전히 선택된 상태에서 [단락 스타일]([창]> [단락 스타일]) 패널의 아래쪽에 있는 [새 스타일] 버튼을 클릭합니다. 새 단락 스타일을 두 번 클릭하고 food-header로 이름을 바꿉니다.

    그러면 동일한 서식을 메뉴의 다른 텍스트 머리글에 다시 적용하기가 쉬워집니다.

  6. [텍스트] 도구를 사용하여 다음 아침 식사 항목인 Croissants $3을 선택합니다.

  7. food-header라는 단락 스타일을 클릭하여 동일한 서식을 두 번째 아침 식사 항목에 적용합니다.

  8. 7 ~ 8단계를 반복하여 텍스트 프레임의 모든 아침 식사 항목(달러 기호가 포함된 모든 행)에 food-header 단락 스타일을 선택하고 적용합니다.

  9. 맨 위부터 [텍스트] 도구를 사용하여 첫 번째 아침 식사 항목 설명인 Bananas, mandarin oranges, red delicious apples, mixed berry cup을 선택합니다.

  10. [단락 스타일] 패널에 나열된 본문 단락 스타일을 클릭하여 텍스트 행에 서식을 적용합니다.

  11. 아침 식사 항목 아래의 나머지 각 설명 텍스트를 하나씩 선택하고 본문 단락 스타일을 적용합니다.

fig_66_building
서식을 적용하여 단락 스타일로 메뉴 스타일을 지정합니다.

샘플 사이트의 라이브 버전을 방문하고 디자인을 참조하면 도움이 될 것입니다.

텍스트 작업에 대한 자세한 내용은 Adobe Muse의 타이포그래피를 참조하십시오.

내장된 맞춤법 검사기 사용

Adobe Muse에는 텍스트 프레임에서 맞춤법 오류를 쉽게 찾아 해결할 수 있는 맞춤법 검사기가 포함되어 있습니다. 맞춤법 검사기는 항상 사용으로 설정됩니다. 사전에서 찾을 수 없는 단어에는 빨간색 밑줄이 표시됩니다.

fig_67_building
맞춤법이 틀린 단어는 빨간색 밑줄로 표시됩니다.

fig_68_building

제안된 단어 중 하나가 올바른 경우 아래쪽 화살표를 누르거나 마우스를 사용하여 원하는 제안된 단어를 선택한 다음 Return/Enter 키를 눌러 적용합니다. 실수로 틀린 단어를 선택한 경우 간단히 변경 내용을 취소([편집] > [실행 취소])하고 다른 제안된 단어를 선택하거나 [텍스트] 도구를 사용하여 단어를 편집합니다.

맞춤법 오류로 표시된 단어(사람의 이름이나 지명)가 한 번만 사용되고 올바르게 입력되었음을 알고 있는 경우 수정할 필요가 없습니다. [디자인] 보기에 나타나는 빨간색 밑줄은 사이트를 미리 보거나 게시하거나 내보내는 경우 표시되지 않습니다.

회사 이름이나 주소와 같이 일반적으로 사용되는 단어로 작업할 때는 맞춤법 오류로 표시되지 않도록 맞춤법 검사기 사전에 단어를 추가할 수 있습니다.

[텍스트] 도구를 사용하여 사전에 추가할 단어를 마우스 오른쪽 단추로 클릭한 다음 나타나는 컨텍스트 메뉴에서 [사전에 추가] 옵션을 선택합니다.

전체 사이트 및 개별 텍스트 프레임에 대해 원하는 언어를 설정(이에 따라 맞춤법 검사기 언어 사전도 설정)할 수 있습니다.

전체 사이트에 대한 맞춤법 검사기 사전을 설정하려면 [파일] > [사이트 속성]을 선택합니다. [텍스트] 탭을 클릭하고 [언어] 메뉴에서 원하는 언어를 선택한 다음 [확인]을 클릭합니다.

fig_69_building
[사이트 속성] 대화 상자에서 전체 사이트에 대한 언어를 설정합니다.

일부 사이트 프로젝트의 경우 여러 언어로 텍스트를 제공해야 할 수 있습니다. 이러한 경우 [사이트 속성]에서 기본 언어(가장 자주 사용되는 언어)를 설정한 다음 다른 언어로 텍스트가 표시되는 특정 텍스트 프레임에 대해 맞춤법 검사기 언어를 설정할 수 있습니다.

텍스트 프레임에 대한 맞춤법 검사기 사전을 설정하려면 [선택] 도구로 텍스트 프레임을 선택합니다. 마우스 오른쪽 단추를 클릭하면 나타나는 컨텍스트 메뉴에서 [언어] > (원하는 언어 선택)을 선택합니다.

fig_70_building
컨텍스트 메뉴에서 선택한 텍스트 프레임에 대한 언어를 설정합니다.

이제 텍스트 프레임의 모양을 업데이트합니다. 사각형 및 이미지 프레임과 마찬가지로 텍스트 프레임의 획, 채우기 및 배경 이미지를 설정하여 스타일을 지정할 수 있습니다.

텍스트 프레임의 모양 업데이트

이 단원에서는 페이지의 배경 그래픽에서 눈에 띄도록 텍스트 프레임의 특성을 업데이트합니다.

  1. [선택] 도구를 사용하여 아침 식사 메뉴가 포함된 텍스트 프레임을 선택합니다.

  2. 컨트롤 패널에서 획 두께를 5로 설정하고 획 색상을 검은색으로 설정합니다.

  3. [채우기] 메뉴를 사용하여 cream-menu로 이름을 바꾼 색상 견본으로 채우기 색상을 설정합니다(또는 16진수 색상 값 #E9916F 입력). [이미지] 섹션 옆에 있는 폴더 아이콘을 클릭하고 샘플 파일 폴더에 있는 bg-texture.png라는 파일을 찾아 선택합니다. [확인]을 클릭하여 [가져오기] 대화 상자를 닫습니다. [맞춤] 메뉴를 [바둑판식]으로 설정한 다음 페이지의 다른 곳을 클릭하여 [채우기] 메뉴를 닫습니다.

  4. 필요한 경우 [선택] 도구를 사용하여 텍스트가 맞을 때가지 텍스트 프레임의 핸들을 드래그하고 크기를 조정합니다. 라이브 샘플 사이트의 아침 식사 메뉴 규격은 약 800픽셀 폭 x 440픽셀 높이입니다.

    크림 채우기 색상의 바둑판식 배경 이미지는 텍스트 프레임에 양피지 같은 효과를 추가하고 진한 획은 배경에서 눈에 띄는 데 도움을 줍니다.

    이제 방문자가 쉽게 알아볼 수 있도록 아침 식사 메뉴의 상단에 제목을 추가합니다.

  5. [텍스트] 도구를 사용하여 Breakfast 메뉴 바로 위에 텍스트 프레임을 만듭니다(상단 왼쪽에 맞춤).

  6. Breakfast라는 단어를 입력합니다.

  7. [텍스트] 패널에서 다음 설정을 선택하여 텍스트 서식을 지정합니다.

    • 웹 글꼴: Kaushan Script(또는 사용자가 원하는 스크립트 글꼴)
    • 글꼴 크기: 32 색상: #70909D(3부에서 이 색상 이름을 blue-menu로 바꿈)
    • 행간: 120%
    • 정렬: 가운데 맞춤
  8. 텍스트가 여전히 선택된 상태에서 [단락 스타일] 패널의 아래쪽에 있는 [새 스타일] 단추를 클릭하여 새 단락 스타일을 만듭니다. 새 단락 스타일을 두 번 클릭하고 menu-label로 이름을 바꿉니다.

아침 식사 메뉴 위쪽의 레이블은 사용자를 안내하고 읽고 있는 메뉴가 무엇인지 눈에 띄도록 하는 데 도움을 줍니다. 변경 작업을 수행한 후 완료된 아침 식사 메뉴는 다음 이미지와 비슷하게 나타납니다.

fig_71_building
아침 식사 메뉴의 스타일이 지정되고 텍스트 내용의 서식이 지정되었습니다.

다음 단원에서는 아침 식사 메뉴를 복제한 다음 복제된 텍스트 프레임의 텍스트 내용을 업데이트하여 점심, 저녁 식사 및 디저트 메뉴를 만들 것입니다.

텍스트 프레임 복제

앞 단원에서는 아침 식사 메뉴 텍스트 프레임을 만들고, 외부 텍스트 파일의 텍스트로 채우고, 단락 스타일을 사용하여 일관성 있는 텍스트 서식을 적용한 다음, 바둑판식 배경 이미지, 채우기 색상 및 획을 추가하여 텍스트 프레임의 모양을 업데이트했습니다. 메뉴 텍스트 프레임 위에 두 번째 텍스트 프레임을 추가하여 아침 식사 메뉴를 확인할 수 있는 머리글을 만들었습니다. 다음 단계에서는 이러한 요소를 세 번 복제하여 총 4개의 메뉴를 만들게 됩니다.

  1. [선택] 도구를 사용하여 Breakfast 단어가 있는 텍스트 프레임을 선택하고 아침 식사 메뉴가 포함된 텍스트 프레임을 선택합니다.

  2. Option 키(Mac) 또는 Alt 키(Windows)를 누른 상태에서 두 텍스트 프레임을 페이지 아래로 드래그하여 복제된 복사본을 만듭니다. 아래로 드래그 및 복사하고 원본과 세로로 정렬합니다(측면과 가운데가 정렬되면 스마트 안내선이 잠시 나타납니다). 복제된 텍스트 프레임은 원본에서 아래쪽으로 약 430픽셀이어야 합니다.

    fig_72_building
    아침 식사 메뉴의 복제본을 페이지 아래로 드래그합니다.

  3. [텍스트] 도구를 사용하여 복제된 텍스트 필드의 레이블을 선택합니다. Breakfast 단어를 Lunch로 바꿉니다.

  4. 잠시 Adobe Muse에서 바탕 화면으로 전환합니다. 샘플 파일 폴더를 열고 text-food-lunch.txt라는 파일을 찾습니다. 파일을 두 번 클릭하여 텍스트 편집기에서 엽니다. 텍스트의 첫 번째 행인 The JR $9를 복사합니다..

  5. Adobe Muse로 돌아갑니다. [텍스트] 도구를 사용하여 점심 식사 메뉴 텍스트 프레임 내부를 클릭합니다. 복사한 텍스트 내용을 텍스트 프레임에 붙여 넣어 기존에 나열된 첫 번째 음식 항목인 Croissants $3을 바꿉니다..

  6. 4 ~ 5단계를 반복하고 text-food-lunch.txt 파일에서 달러 기호가 있는 각 행을 복사하여 점심 식사 메뉴의 항목을 바꿉니다.

  7. text-food-lunch.txt 파일에 있는 각 설명을 복사하고 복제된 점심 식사 메뉴의 기존 설명 위에 하나씩 설명을 붙여 넣어 점심 식사 메뉴를 계속 채웁니다. 이 전략은 텍스트 내용에 적용한 스타일이 유지되도록 합니다.

  8. 1 ~ 7단계를 반복하여 두 점심 식사 텍스트 프레임을 선택하고 복제한 다음 기존 점심 식사 메뉴에서 약 430픽셀 아래쪽으로 드래그하고 레이블을 Dinner로 바꾼 다음 text-food-dinner.txt 파일에서 항목을 복사하여 저녁 식사 메뉴를 채웁니다.

  9. 8단계를 다시 한 번 반복합니다. 이번에는 복제된 레이블을 Dessert로 바꿉니다. text-food-dessert.txt에서 텍스트 행을 복사하여 디저트 메뉴를 마무리합니다.

  10. 필요에 따라 4개의 텍스트 프레임이 각 영역 사이에 약 120픽셀로 세로로 정렬되도록 선택 도구를 사용하여 4개의 각 텍스트 프레임을 재배치합니다.

    fig_73_building
    음식 페이지에 4개의 메뉴(아침, 점심, 저녁 식사, 디저트) 모두를 세로로 정렬합니다.

각 복제본을 아래로 드래그할 때 1부에서 정의한 바닥글 영역이 자동으로 아래로 이동하여 페이지에서 더 많은 세로 공간을 만든다는 것을 알 수 있습니다. 이에 따라 음식 페이지는 샘플 사이트의 다른 페이지보다 더 길어집니다.

각 메뉴 위에 기준점을 추가하여 방문자가 각 메뉴로 신속하게 이동할 수 있게 해주는 탐색 시스템을 만들어야 합니다. 음식 페이지는 더 길기 때문에 방문자가 클릭하는 메뉴에 따라 내용이 세로로 스크롤되어 해당하는 메뉴가 표시됩니다. 또한 링크 작업을 통해 방문자가 PDF 파일을 다운로드할 수 있는 다운로드 링크를 비롯하여 다양한 유형의 링크를 만드는 방법을 살펴봅니다.

기호 및 특수 문자 삽입

[문자 모양] 패널을 통해 표준 키보드에서 사용할 수 없는 ©와 같은 기호나 베타(ᵝ)와 같은 특수 문자를 입력할 수 있습니다. [문자 모양] 패널을 통해 유니코드 문자를 삽입할 수 있습니다.

삽입할 수 있는 기호 및 문자의 유형은 선택하는 글꼴에 따라 달라집니다. 예를 들어, 일부 글꼴에는 국제 문자(Ç, ë) 및 국제 통화 기호(£, ¥)가 포함될 수 있습니다. 내장된 기호 글꼴에는 화살표, 글머리 기호 및 과학 기호가 포함됩니다.

[문자 모양] 패널을 사용하여 문자를 삽입하려면 다음을 수행합니다.

  1. 문자를 삽입할 웹 페이지에서 텍스트 프레임을 그립니다(아직 그렇게 하지 않은 경우).

  2. [창] > [문자 모양]을 선택하여 [문자 모양] 패널을 표시합니다.

  3. 드롭다운을 사용하여 삽입할 문자의 범주를 선택합니다.

  4. [문자 모양] 패널에서 선택한 범주의 모든 문자를 표시합니다. 삽입할 문자를 클릭합니다.

텍스트 프레임 양식 편집

텍스트에 웹 글꼴, 웹 안전 글꼴, 시스템 글꼴 중 어떤 글꼴을 적용하든 디자인 보기에서 작업할 때 항상 텍스트 내용을 편집할 수 있습니다. 텍스트 프레임 자체의 양식을 변경하여 텍스트 블록을 다르게 표시할 수 있습니다.

텍스트 프레임을 텍스트의 각 섹션을 둘러싼 컨테이너라고 생각해 보십시오. 여러 방법으로 텍스트 프레임을 제어하여 라이브 사이트에서 표시되는 방식을 변경할 수 있습니다.

텍스트의 서식 및 스타일을 지정하려면 [선택] 도구를 사용하여 텍스트 프레임을 선택한 다음 변경 내용을 적용하면 텍스트 내용의 양식에 반영됩니다.

참고: [텍스트] 도구를 사용하여 텍스트를 선택한 경우 [텍스트] 패널 또는 컨트롤 패널에서 서식 옵션을 설정하여 텍스트의 스타일을 지정할 수 있습니다.

핸들을 드래그하여 늘리거나 줄이면 텍스트 프레임의 크기를 조정할 수 있습니다. 또한 페이지에서 전체 텍스트 프레임을 드래그하여 재배치할 수 있습니다. 텍스트 프레임의 크기를 조정할 때 툴팁에 치수가 표시됩니다.

fig_15_type
텍스트 프레임의 핸들을 드래그하여 크기를 조정합니다.

텍스트 프레임을 회전할 수도 있지만 텍스트 프레임을 회전하면 (적용하는 글꼴에 상관없이) 텍스트는 이미지 파일로 내보내집니다. 텍스트 프레임은 가능한 적게 사용하고 회전된 텍스트에 제목을 추가하십시오.

텍스트 프레임 컨테이너의 양식을 변경할 때 사각형 편집에 사용하는 서식과 동일한 옵션을 사용할 수 있습니다. 채우기 색상을 설정하고 배경 이미지를 추가할 수도 있습니다. 또한 획을 설정하고 동일한 설정을 사용하여 획 두께, 색상 및 정렬을 조정할 수 있습니다. 컨트롤 패널의 [모퉁이] 및 [효과] 메뉴를 사용하여 텍스트 프레임의 [모퉁이 반경]을 설정하고 그림자, 경사 및 광선을 적용할 수 있습니다.

텍스트 프레임에 투명도를 적용하려면 불투명도 슬라이더를 사용하여 불투명도 값을 변경합니다.

[하이퍼링크] 메뉴 및 [하이퍼링크] 필드를 사용하여 텍스트에 제목을 추가하고 링크를 추가하고 새 브라우저 창에서 링크가 열릴지 정의할 수 있습니다.

이미지 주위의 텍스트 정렬 조정 및 텍스트 줄바꿈

페이지 내용 제작 시 텍스트 프레임은 매우 중요합니다. 이전 섹션에서 살펴본 것과 같이 텍스트 프레임에는 텍스트 내용은 물론 그래픽 요소와 효과도 포함되어 있습니다.

이 섹션에서는 더 많은 공백을 추가하여 안쪽 여백을 설정함으로써 텍스트 프레임 내에서 텍스트 내용을 조정하는 방법을 살펴보겠습니다. 이미지 주위에서 줄바꿈되는 텍스트 열을 추가하여 매거진 스타일의 레이아웃을 만드는 방법을 알아봅니다.

텍스트에 안쪽 여백 추가

기본적으로 텍스트 프레임에 입력, 배치 또는 붙여넣는 텍스트는 왼쪽 정렬됩니다. [간격] 패널의 설정을 보면 모두 0으로 설정되어 있습니다.

PaddingZero
텍스트 프레임에 기본 적용된 안쪽 여백입니다

텍스트 프레임의 왼쪽, 오른쪽, 위 또는 아래에 여백을 추가하려면 원하는 값을 (픽셀로) 입력하거나 각 필드 옆에 있는 위/아래 화살표를 클릭하여 숫자 값을 늘리거나 줄일 수 있습니다.

텍스트 들여쓰기 및 행간/자간 값 조정

워드 프로세서 및 기타 모든 이미지 편집 도구의 텍스트 내용을 변경하는 것과 마찬가지로 Adobe Muse에서 텍스트 서식을 변경할 수 있습니다. [텍스트] 패널에 다양한 추가 설정이 있지만 일부 설정은 텍스트를 선택하면 컨트롤 패널에 표시되지 않습니다.

단락에서 텍스트의 첫 번째 줄을 들여쓰기하려면 다음 단계를 수행하십시오.

  1. 문자 도구를 사용하여 일부 텍스트를 선택합니다.

  2. 문자 도구에서 들여쓰기 값을 원하는 픽셀 값으로 업데이트합니다.

TypeToolIndent
필드에 숫자를 입력하거나 위/아래 화살표를 클릭하여 값을 변경합니다.

[텍스트] 패널의 [자간] 옵션에서 각 문자 사이의 간격을 정의할 수 있습니다. 이 옵션은 텍스트에 효과를 적용하고 웹에서 멋진 글꼴의 가독성을 높일 때 특히 유용합니다.

[자간] 필드에 픽셀 수를 입력하여 선택한 텍스트에 자간을 적용할 수 있습니다. 또는 원하는 효과를 얻을 때까지 위/아래 화살표를 클릭하여 값을 늘리거나 줄일 수 있습니다.

TypeToolAddSpace
[자간] 필드에 숫자를 입력하거나 위/아래 화살표를 클릭하여 값을 변경합니다.

[행간]은 단락의 텍스트 서식 조정에 사용되는 또 다른 유용한 기능입니다. [행간]을 사용하면 텍스트 줄 간의 여백을 조정할 수 있습니다. [행간] 기능은 컨트롤 패널 및 [텍스트] 패널 모두에서 사용할 수 있습니다.

TypeToolLeading
[행간] 값을 조정하여 줄 간의 여백을 늘리거나 줄입니다.

[텍스트] 패널에서 다음과 같이 4개의 타이포그래피 컨트롤을 사용할 수 있습니다.

왼쪽 여백 및 오른쪽 여백

이 설정은 텍스트 프레임이나 텍스트 프레임 테두리 양쪽의 문자 간 여백을 조정합니다. 이 설정은 [간격] 패널의 [안쪽 여백] 값을 설정하는 방법과 비슷합니다. 차이점은 ([텍스트] 도구에서 텍스트 내용을 선택하는 것이 아니라) [선택] 도구로 텍스트 프레임을 선택하여 안쪽 여백 값을 편집한다는 점입니다.

단락 앞뒤 간격

이 설정을 사용하면 단락 줄바꿈(하드 리턴) 앞뒤에 표시되는 간격을 (픽셀로) 조정할 수 있습니다. 또한 단일 텍스트 프레임 내 단락 간 여백을 늘리거나 줄일 수 있습니다.

페이지 디자인 시 텍스트 내용이 표시되는 방식을 조정할 수 있도록 [텍스트] 패널의 모든 설정을 테스트해 보십시오.

텍스트 파일에서 가져온 텍스트를 페이지에 배치

이 샘플 프로젝트의 본문에 사용할 텍스트는 Kevins_Koffee_Kart 폴더의 소스 파일에 포함되어 있습니다. 이 텍스트는 TXT 파일로 저장되어 있습니다. Adobe Muse에서는 텍스트 파일 자체를 배치하여 페이지에 내용을 추가할 수 있습니다. 텍스트 편집기로 텍스트 파일을 열고 텍스트 줄을 복사한 다음 페이지에 붙여넣는 번거로운 과정을 거치지 않아도 됩니다.

  1. [파일] > [배치]를 선택하거나 바로 가기 키 Command+D(Mac) 또는 Ctrl+D(Windows®)를 사용하여 배치 작업을 시작할 수 있습니다. 이 작업 과정은 페이지에 이미지 파일을 배치할 때와 같습니다.

  2. [가져오기] 대화 상자에서 Kevins_Koffee_Kart 폴더를 찾은 다음 TextThreeSpeed.txt라는 텍스트 파일을 선택합니다.

  3. 아코디언 위젯의 좀 더 넓은 컨테이너, 즉 "TASTING NOTES" 머리글 아래 있는 연한 회색 부분을 클릭하여 맨 위쪽 [아코디언] 패널에 텍스트 파일의 내용을 배치합니다.

  4. 새 텍스트 프레임을 배치한 후 [선택] 도구를 사용하여 해당 텍스트 프레임의 위치를 "TASTING NOTES" 머리글 아래로 조정하고, 텍스트 프레임의 위쪽, 아래쪽 및 양 옆 핸들을 드래그하여 머리글과 그 아래 텍스트에 맞게 연한 회색 컨테이너를 필요한 만큼 확장합니다. 방금 배치한 텍스트를 클릭한 채 드래그하여 머리글 텍스트의 왼쪽에 맞춰 정렬합니다. 두 항목이 나란히 배치되면 파란색 안내선이 잠시 나타났다 사라지므로 텍스트를 쉽게 정렬할 수 있습니다. 핸들을 드래그하여 텍스트의 크기를 조정할 수 있을 뿐만 아니라, 회색 컨테이너를 클릭한 후 아래쪽 핸들을 드래그하여 컨테이너의 높이를 확장할 수도 있습니다.

  5. 연한 회색 컨테이너를 선택한 상태에서 [채우기] 색상 피커를 클릭하고 패널의 배경색을 [채우기 없음]으로 설정합니다.

    fig_40
    맨 위쪽 회색 탭에 텍스트를 추가하고 해당 컨테이너를 내용에 맞춰 확장합니다.

동기화된 텍스트 작업

동기화된 텍스트 작업에 관한 내용을 보려면 동기화된 텍스트 작업을 참조하십시오.

반응형 레이아웃에서 텍스트 작업

반응형 레이아웃에서 텍스트 서식을 지정하는 방법에 대한 자세한 내용은 반응형 레이아웃에서 텍스트 작업을 참조하십시오.

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

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