텍스트

뉴스 기사나 블로그 게시물의 내용과 같이 대화형이 아닌 제목이나 단락 문자열의 내용을 표시하려면 텍스트 구성 요소 기호를 사용합니다.

텍스트 데모

제목과 단락

텍스트는 제목과 단락에 대해 두 가지 변형으로 제공됩니다.

제목 크기

텍스트 제목은 가장 큰 H1부터 훨씬 작은 H5 및 H6까지 6가지 사전 설정 크기로 제공됩니다.

제목을 삽입한 후 선택한 크기에 맞는 높이를 지정했는지 확인하세요. | 사이즈 | 픽셀 높이 | | -- | ----- | | H1 | 170px | | H2 | 85px | | H3 | 68px | | H4 | 42px | | H5 | 36px | | H6 | 31px |

단락 크기

텍스트 단락은 더 큰 본문 1, 더 작은 본문 2, 이미지와 제목에 주석을 다는 데 사용되는 작은 캡션 등 세 가지 미리 설정된 크기로 제공됩니다.

단락을 삽입한 후 선택한 크기와 텍스트 내용의 길이에 따라 올바른 높이를 지정해야 합니다. 단락이 여러 줄의 텍스트에 걸쳐 있는 경우 아래 표의 값에 줄 수를 곱합니다. | 사이즈 | 픽셀 높이 | | ------- | ------------ | | 본문 1 | 24px | | 바디 2 | 21px | | 캡션 | 19px |

스타일링

제목과 단락에는 옵션을 통해 제한된 스타일 유연성이 제공되므로 스타일링 라이브러리의 타이포그래피 부분에서 사용할 수 있는 텍스트 두께와 색상 사전 설정에서만 선택할 수 있습니다.

용법

두 가지를 함께 사용하는 경우 하이퍼링크를 눈에 띄게 만드는 단락 텍스트 색상을 항상 선택하십시오. 동일한 색상이나 유사한 뉘앙스를 사용하지 말고 전체 디자인에서 일관된 제목 및 단락 색상을 선택하세요. 한 줄 주석에만 단락 캡션 크기를 사용하고 더 긴 여러 줄 문자열에는 작은 글꼴 크기를 사용하지 마십시오.

하다	하지 않다

코드 생성

이 섹션에서는 몇 가지 중요한 재정의와 이러한 재정의가 코드 생성에 미치는 영향을 설명합니다.

경고

디자인의 제목 또는 단락 텍스트 인스턴스에서 Detach from Symbol 트리거하면 제목 또는 단락 텍스트에 대한 코드 생성 기능이 손실될 가능성이 매우 높습니다. 코드 생성이 Sketch의 레이아웃과 일치할 수 있도록 하려면 제목과 단락의 높이가 콘텐츠를 렌더링하는 데 필요한 만큼 적절한 높이인지 확인하세요.

텍스트

TheText 속성에는 텍스트 또는 두 가지 예의 조합이 포함될 수 있습니다.

• 설정
• {설정라벨}
• 중요 {labelText}

추가 리소스

우리 커뮤니티는 활동적이며 항상 새로운 아이디어를 환영합니다.